Thursday, May 14, 2009

The Magic Footer

I've done this before, but like usual if I only do it once in a while I forget how. The task at hand? Have a footer on a web page that stays at the bottom of the page. I did a quick search, and here are two ways (though there are others) of doing this.

1) Frack older browsers, and do it the easy way,

2) Or two, do a minimal CSS hack so you can support IE6 and older versions of Safari.

So here is some reinvent the wheel code. For number one, you just need a bit of CSS.

.footer{ width:100%; height:50px; position:fixed; bottom:0px; z-index:1000;}

then on your page, <div id="footer" >


For step two, try this approach.

CSS bottom footer by MJT, or google fixed footer.

No comments: