H Bellamy H Bellamy - 5 months ago 9
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.


This is precisely what position: fixed was designed for:

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

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