How to make last div stretch to fill screen?
Posted
by Conor
on Stack Overflow
See other posts from Stack Overflow
or by Conor
Published on 2010-03-12T19:46:01Z
Indexed on
2010/03/12
19:47 UTC
Read the original article
Hit count: 212
I have a site I'm trying to build and I've hit one little snag thats driving me insane. Essentially on pages without enough content to fill the viewport, I want to have the last div (my footer, fill the rest of the viewport, but it's currently being cut off.
My html looks like this:
<body>
<div id="header"> </div>
<div id="subNav"> </div>
<div id="content"> </div>
<div id="footer"> </div>
</body>
I tried using html, body, footer { height:100%; } but that creates much more space then needed, essentially a full screen length of blank content in the footer.
How do I get my footer just to fill teh rest of the screen without adding a scroll bar?
Thanks in advance, One Frustrated Coder.
© Stack Overflow or respective owner
