I recently needed a div banner on a liquid width site to keep its height proportional to its width - however a quick google search didn't find anything on the subject.
So, I developed my own technique, based on paddings and absolute positioning. The full write-up is available here: http://leszek.swirski.co.uk/proportionaldiv.htm It's quite a long write-up (my first!), but in summary you have two divs, #outer and #inner, which are styled as follows: α = width required β = height when width is 1 (height/width ratio) #outer { height: 0; width: α; padding-bottom: α * β; position: relative; } #inner { position: absolute; top: 0; bottom: 0; width: 100%; height: 1/α; } So for a div width 50%, in which you want to keep a height-width ratio of 1:2, you'd have: #outer { height: 0; width: 50%; padding-bottom: 25%; position: relative; } #inner { position: absolute; top: 0; bottom: 0; width: 100%; height: 200%; } I hope this comes in useful for someone. - Leszek http://leszek.swirski.co.uk ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/