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:
#inner { position: absolute; top: 0; bottom: 0; width: 100%;
height: 200%; }
/*\*/ * html #inner {height: 200%;} /**/
And the crazy reason IE/win needs that height in the first place, is
that IE/win can't handle AP for opposite edges of an element.
IE/win can't make inner fill outer in
Your test case actually covers a lot of my screen when I don't hide the
200% from the others.
Ingo
And that just goes to prove that IE is a cross-platform pain in the arse.
Thanks for the testing, I've updated (again):
http://leszek.swirski.co.uk/proportionaldiv.htm
- Leszek
