H Bellamy H Bellamy -5 years ago 181
CSS Question

Make div stay at bottom of page's content all the time even when there are scrollbars

CSS Push Div to bottom of page

Please look at that link, I want the opposite: When the content overflows to the scrollbars, I want my footer to be always at the complete bottom of the page, like Stack Overflow.

I have a div with id of

and this CSS:


But all it does is go to the bottom of the viewport, and stays there even if you scroll down, so it is no longer at the bottom.

Image: Examlple

Sorry if not clarified, I don't want it to be fixed, only for it to be at the actual bottom of all the content.

Answer Source

This is precisely what position: fixed was designed for:

#footer {
    position: fixed;
    bottom: 0;
    width: 100%;

Here's the fiddle: http://jsfiddle.net/uw8f9/

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download