css - Bottom aligning div without specifying parent container height -


i have html this

<div class="grow">     <div class="cell c9 right last">text</div>     <div class="cell c8 right gcol8">long text wrapped on multiple lines</div>     <div class="cell c7 right gcol7">text</div> </div> 

see fiddle: http://jsfiddle.net/lmzye/

what have 2 "text" div's align bottom of grow div.

i don't know height of grow @ render time text changes selected language. have tried positioning grow relative , inner div's absolute, bottom:0 in vain.

can i'm trying or need know height of grow div?

enter image description here

edit: forgot 1 thing: have right border going way top bottom of grow.

thanks in advance!

if need using divs rather table can use css display:table make divs respond table would:

html

<div class="table">     <div class="row">         <div class="cell c9 right last">text</div>         <div class="cell c8 right gcol8">long text wrapped on multiple lines</div>         <div class="cell c7 right gcol7">text</div>     </div> </div> 

css

.table {display:table; border-right: 1px solid red;} .row {display:table-row;} .cell {border-left: 1px solid red; display:table-cell; width:33%;} 

then can keep adding rows , cells please.

you able take advantage of vertical-align property if want align text middle or bottom of div

http://jsfiddle.net/lmzye/6/


Comments

Popular posts from this blog

php - Why I am getting the Error "Commands out of sync; you can't run this command now" -

linux - Does gcc have any options to add version info in ELF binary file? -

java - Are there any classes that implement javax.persistence.Parameter<T>? -