A List Apart: Articles: Exploring Footers
A List Apart: Articles: Exploring Footers
|
|
Positioning footers with CSS and the W3C DOM. … In this case, the footer will be positioned at the bottom of the browser window. …
Similar Posts
[UPHPU] css question: position absolute @ bottom
Previous message: css question: position absolute @ bottom … at the bottom of the > browser window, no matter how large the browser window is. …CSS Sticky Footer
If you are looking for a good pure CSS footer solution, look no further. CSS Sticky Footer works for over 50 Windows, Linux, and Mac-based browsers. Included in this list are the latest releases of Google Chrome, Mozilla Firefox, Opera, Safari, and Internet Explorer.
CSS Sticky Footer is developed by Steve Hatcher, and is based on the Exploring Footers article from A List Apart, and takes suggestions from Cameron Adams’ footerStickAlt, and The Pure CSS Footer example from lwis.net. It applies a clear fix hack to keep the footer in place in Google Chrome and other browsers where the footer would float up when you resized the window. The clearfix also fixes problems that might occur if you are using floats to create two or three column layouts.
Far from being perfect, it does have its share of issues. The first one deals with margins, which can easily be solved by changing margins to padding instead. The second one deals with the use of relative font sizes such as % or em, something which many of the more advanced CSS gurus like me are very much fond of. The author suggests using px instead, which many find unacceptable.
To get started, check out the HowTo page for details on how to implement the CSS Sticky Footer.