1

I have a few inline blocks that are side by side and want to align the baselines of the first line of text on each of those.

Example: http://jsfiddle.net/wW9hH/

I want each container to have the baseline of "Line 1" aligned with the other containers "Line 1". Is there any way to achieve that with CSS. Also display: table-cell is not an option in my case (because I want the divs to wrap on smaller displays).

Razvi
  • 2,808
  • 5
  • 31
  • 39
  • 1
    This looks like it is a job for a table. Why is that not an option? – Mr Lister Nov 07 '13 at 13:27
  • I need the divs to wrap on smaller displays. – Razvi Nov 07 '13 at 13:38
  • @cimmanon I don't think it's a duplicate for that, I want baseline alignment with wrapping, the other wants bottom alignment. – Razvi Nov 07 '13 at 13:43
  • 1
    Use table-cell at large widths then change the display for smaller screens with media queries? – 2507rkt3 Nov 07 '13 at 13:43
  • 2
    @Razvi I think you are misunderstanding what the *baseline* is. If I can copy/paste the solution from another question to your code then yes, your question is a duplicate: http://jsfiddle.net/wW9hH/3/ – cimmanon Nov 07 '13 at 14:22
  • @cimmanon Sorry, thought the other question wanted something different. Yes it is a duplicate then. :) – Razvi Nov 07 '13 at 14:39
  • Btw, flex doesn't work for my case as it's not supported well enough (because of IE) ... @jbenjohnson I used media queries in the end as you suggested :), you can move the comment to an answer if you want to:) – Razvi Nov 07 '13 at 21:30

0 Answers0