Footer Info
From CSS Discuss
Footer positioning information
Faking fixed positioning
In non-IE browsers and IE7, creating the appearance of an HTML frame is easy: set the element you want to "stick" to the window to "position: fixed" and give it whatever top, left, bottom, or right values you want to control where it sticks within the viewport. However, fixed positioning doesn't work in WinIE versions 6 or below, so you'll need to either let it degrade gracefully (changing to absolute positioning is a good option for a footer) or hack it. The links below show how to hack a fixed footer in IE 6 and below. Also look at Three Column Layouts for more ideas.
- Devnull WinIE fix for fixed positioning - Buggy in MacIE
- Cookiecrook mod to Devnull's example - Specific to footer works around a MacIE bug with a Css Hack
- Emulating Frames - Based on the above, these pages show how to emulate frames (including fixed footers) in WinIE and then some.
On bottom of page
Similar to above, except footer is always below the content, and at the very bottom of the screen. If there is not enough content to fill the page vertically, the footer sits at the bottom of the window. If there is enough content to fill the page and make it scroll, the footer immediately follows the end of the content as it would in a normal flow.
- Footer Stick Alt by The Man in Blue Tested and works in WinIE 5+, Firefox 1.0.2+, Opera 7.51+, Safari 1.3. Improves upon Craig Erskine's Footer Stick method, which did not work in Safari and had a Firefox bug.
- Scott Sauyet's Footer Demo 1 Works in IE5.5+/Win and all recent Mozilla versions, doesn't work in Opera 6 [works well in Opera 7.50 p1, but the footer is only visible AFTER scrolling (full page + footer)] [Didn't work well in Opera 5/6]
- Simple valid CSS version for a bottom footer
- Grauw's footer positioning method Tested in IE6/Win, Moz1.6 and Opera7. [Didn't work well in Opera 5/6] [Doesn't work in Safari 1.2.3]
- ALA article Explains the pure CSS method, then offers a Javascript to build support for Safari and MacIE.
- Sitepoint Forum This technique works in about 95% of the browsers.
- Ryan Fait's CSS Sticky Footer
