> 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/
