> From: Stephen Cunliffe > Sent: Thursday, June 01, 2006 3:13 PM > What I want, is for the lower "body" section to be 100% of > the browser window height, minus the 50px at the top. > What I've posted, exceeds the vertical browser window, as it > is 100% of > the window height, not the remaining height (100% -50px)
You define body to be 100%, then you define an element with an ID of body (bad practice) to also be 100%. That is part of the problem. Below is the style section I used to get the effect (I think) you are after (tested on FF/WinXP). <style> html, body, p /* Paragraphs also have padding/margin that need to be adjusted as desired */ { margin:0; /* no need for px (or any other unit of measurement) on zero */ padding:0; } div#header { background-color: #cceeff; height: 50px; } div#content /* Changed from #body to #content */ { background-color: #eeffcc; overflow: auto; } </style> </head> <body> <div id="header"> <p>id="header": Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum leo massa, interdum molestie, tincidunt vel, luctus ut, purus. Praesent a nunc. Aenean non ante sed eros auctor vulputate. Nulla et velit. Nullam enim. Nullam in tellus. Donec id eros. Morbi tempor. Nulla semper volutpat nulla. Nam sem ante, aliquet eu,.</p> </div> <div id="content"> <p>id="body":Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum leo massa, interdum molestie, tincidunt vel, luctus ut, [snip] </p> </div> </body> </html> HTH. --G ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/