When I code up a new web page, I frequently rely on the world’s largest repository of CSS reference materials – tha Intarweb. This evening I was Googling for techniques on using CSS to pin a footer at the bottom of a web page, I stumbled across the following article at, of all godforsaken places, Apple’s Developer site:
Another common problem with CSS is ensuring a proper page footer. On long pages that use more space than the window height, the footer should appear directly below the navigation and content blocks. That’s very easy to code. On short pages, though—those that span only part of the window height—the footer should nonetheless appear at the bottom of the viewport, and that’s a far trickier code challenge… Ensuring that the footer works properly on both long and short pages is a common cause of CSS headache.
Tables neatly solve these two problems. Correct horizontal alignment has been the most important advantage of tables ever since Mosaic. Giving the table a height: 100% and the cell containing the footer a vertical-align: bottom makes the footer reliable in all circumstances.
Oh, for the love of Netscape 4.x! This may have been true back when KISS was still touring but in the modern day, if the solution to your problem involves using a table for layout, you’ve just got more problems.