making a div extend all the way down to the bottom of the page

Question

Hi There,

My website has varaible content length, and this sometime means that the footer does not site at the bottom of the page, is there a way to make the footer fill whatever space is left?

http://www.ibdnetwork.co.uk/members-content/forums

Answer 1

Take a look at excellent post at CSS-Tricks.Com:

• A Bulletproof Sticky Footer, Woohoo!

See the demo here :)

Answer 2

See if this helps:

http://stackoverflow.com/questions/147528/how-to-force-a-div-block-to-extend-to-the-bottom-of-a-page-even-if-it-has-no-con

Answer 3

css

#footer {
  position:fixed !important;
  bottom:0;
}

This should do it. You can add a padding on your content wrapper that have the height of your footer + 50px or something like that, for spacing between content and footer. The footer will be on top of your content else.