css html

Keeping your footer at the bottom of the page

Created a site design but keep getting white space showing below your loving crafted footer? Me too, a bit of research later and I’ve found a fix that works well, integrates with the yui framework, and seems to work well cross-browser.

The basic principle is pretty simple.

  • Make the body 100% tall no matter what.
  • Give it a negative bottom margin the size of your footer.
  • Move you footer up into the space left by the bottom margin

There’s a few other steps to make it work cross-browser (ie6+) but that’s basically it.

I found the solution here.