Div height with repect to resolution

Forum Moderators: not2easy

Message Too Old, No Replies

Div height with repect to resolution

i want to fix the height of content div to 100% (balance height after the

asmanand

7:52 am on Apr 19, 2007 (gmt 0)

<html>
<head>
<style>
#header{ background-color:#cccccc; height:40px; width 100%}
#content{ background-color:#f5f5f5;width 100%}
<body>
<div id="header">head</head>
<div id="content">content</div>
</body>

In the above code,
i want to fix the height of content div to 100% (balance height after the header div with respect to the any resolution.)

how can i achieve this

penders

11:03 am on Apr 19, 2007 (gmt 0)

Just to note, you are missing the ':' in your width declarations above...

width:100%;

Have you tried setting your #content height to 100% ...?

#content{ background-color:#f5f5f5;width:100%;height:100%}

But you will probably need to set the height of the page to 100% also, otherwise a height of 100% will only be as high as your content...

html, body {height:100%}

Is that the sort of thing? Although this may set the #content height just slightly larger (40px + padding/margins) than your page....?!

Is your content always designed to fit within the page area - always visible?

Dabrowski

11:05 am on Apr 19, 2007 (gmt 0)

Mate you have no idea what a large can of worms you have just opened! ;)

Have a look at these threads.....

[webmasterworld.com...]
[webmasterworld.com...]

Dabrowski

2:12 pm on Apr 19, 2007 (gmt 0)

asmanand, I just wrote a little code fix exactly for this header/content set-up in this thread.

[webmasterworld.com...]