Posted by JD on 05/04/07 09:45

Hi

Suppose I want a container that fills the entire height of the browser
window, regardless of the actual height.

In quirks mode, you can do this:

<table width="70%" height="100%">
<tr>
<td>1</td>
</tr>
</table>

However, how do I do this using CSS in standards mode? Is it possible? This:

<div style="background-color: #009; height: 100%">foo</div>

doesn't work at all.

My workaround, until now, has been to create the illusion of a
100%-height div by placing a y-repeating background on the body and then
positioning a div inside, like so:

http://www.sarroukhs.f2s.com/test/

However, I've just realised that this effect breaks badly when you use
the zoom feature in IE7.

Help appreciated!

[Back to original message]