vertical alignment

[thejoker101]

i have one div nested within another, i need the inside one to be at the very bottom of the div around it, vertical-align:bottom and vertical-baseline seem to have no affect, thoughts?

This is what i'm working with:

[code]
<div style="height:169px;width:530px;position:absolute; top:0; left:550px;background: url(the17thdegree/i/medCircle.jpg) #696969 no-repeat 20px 40px;vertical-align:baseline">
<div style="">abc</div>
</div>
[code]

[gil davis]

What browser? I couldn't make vertical-align work in IE 5.5. It is a CSS2 property.

I had to add "display: table-cell" to make it work in NS 7.

[PunkSktBrdr01]

Vertical align is based on line height, so using it in this situation would not be a good idea. Instead, use relative positioning for the nested div and have bottom:100%.

[thejoker101]

Hmm, the last suggestion didn't seem to work. This is the test page I'm using, you can see for yourself: http://www.the17thdegree.com/index2-test.jsp

I'm trying to align that "abc" to the top of the box below it. would it be possible to somehow get a div to be absolutly positioned there?

Thanks for your help.

[PunkSktBrdr01]

As long as the box below it isn't going to move, you can use absolute positioning for it. Set the height to make it line up correctly.