HTML Height Fun
Posted on 2012-03-23
If you examine the HTML below, you'll see that I am trying to achieve a scroll-bar less full-screen design. The yellow area at the top will contain some sort of header junk, the grey area is a menu and the white area is content. It is important that the design fill the entire page without any scrollbars at all.
In firefox this is perfectly achieved.
In IE 9 (maybe 8 too) it will only display a small area in the center (vertically) for the content (blue outline). I've tried DIVS and only resorted to tables for simplicity. Nothing will let me do this right. If I specify a height of 100% on cell containing the COL1 and COL2 table, then I get a scroll bar on the right (again only in IE).
I am pretty good at CSS and I know this should be simple but sometimes the simplest things are the hardest to work out!!