Get that footer to stay at the bottom
and STAY down from LOLcats
Every web designer has tackled the problem of keeping that footer at the bottom of the page, no matter the amount of content above it. At first look one might assume this is a simple task, but as it turns out, you can really drive yourself batty trying to make this seemingly simple task to happen.
A while back I settled on a not so perfect solution that used min-height’s to get the job done. This was alright, but it was problematic in that you never know how your user will have his or her browser sized. I continued on with the development of the site, but never felt quite right about leaving the footer that way. Today I decided to look for a better option once again, and I sure am glad I did! I happened upon Ryan Fait’s Make the Footer Stick to the Bottom of the Page solution!
The solution is so simply beautiful that it makes me wonder how it took so gosh darn long to figure out! There is really only one extra div in the html, and only 15 lines of css! Wait a second, did I just say “gosh darn”? Right well, never mind that. Head over Ryan Fait’s site for all sorts of design resources, including the Sticky Css Footer I love so much!
Discussion