Stosowanie wyrównania w pionie do dwóch elementów div za pomocą wbudowanego bloku

Question

Tak więc mam kilka DIV. Struktura jest to

<div id="content"> 
     <div id="lcol">some content</div> 
     <div id="lcol">some<br />content</div> 
    </div> 

A moim problemem jest to, że dwa DIV są różnej wysokości. Używam display:inline-block dla "lcol", a "content" to zwykły div. Dwóch lcol divów rzeczywiście pojawiają się obok siebie, ale są zakotwiczone na dole div. Chciałbym, żeby były wyrównane do wierzchołka div. Próbowałem dodać vertical-align:top do "zawartości", ale nic się nie stało.

Wszelkie pomysły?

JsFiddle: http://jsfiddle.net/qxe8h/1/

Answer 1

Daj vertical-align: top do inline-block elementów. Napisz tak:

#lcol {vertical-align:top;} 

Sprawdź to http://jsfiddle.net/qxe8h/2/