How to stick a footer to bottom in css?

Question

I am having the classic problem for the positioning of a Footer on the bottom of the browser. I\'ve tried methods including http://ryanfait.com/resources/footer-stick-to-bot

Answer 1

I think a lot of folks are looking for a footer on the bottom that scrolls instead of being fixed, called a sticky footer. Fixed footers will cover body content when the height is too short. You have to set the html, body, and page container to a height of 100%, set your footer to absolute position bottom. Your page content container needs a relative position for this to work. Your footer has a negative margin equal to height of footer minus bottom margin of page content. See the example page I posted.

Example with notes: http://markbokil.com/code/bottomfooter/