absolute
Get flash to fully experience Pearltrees
The Man in Blue > footerStickAlt: A more robust method of positioning a footer
Recently I've been asked to code up a few sites that require the Web page footer to be positioned either at the bottom of the browser window or at the bottom of the Web page – whichever is visually lowest. A quick search on Google immediately brought up solarDreamStudio's immensely helpful tutorial on how to do just this , and so I promptly implemented, with results achieved just as you see on the packet. However, as my pages began to get a bit more complex, in one browser I began to see an intermittent bug. No, not Internet Explorer, but Firefox/Mozilla.
Equal height columns - companion columns method
1 The illusion of equal height columns The search for a technique that offers real equal height columns leads nowhere because we don't have full vertical control in current CSS 2.1 implementations cross browser. The available techniques are simulations of columns: a repeated image displaying Faux Columns [Cederholm], columns made of borders [Livingstone], and variations. We couldn't even fall back on a (CSS-)table, since there is no broad, sufficient implementation of display: table in the browsers. And a table would dismiss the accessibility request for having the columns logically ordered in the source. OneTrueLayout [Robinson] uses a promising technique [Challoner] where the columns are still not equal in height, but they are cut in length, so they appear as-if.Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Companion Columns: Percentages width, FooterStickAlt
A List Apart: Articles: Conflicting Absolute Positions
The most advanced way of achieving such a layout is to use a JavaScript toolkit such as DOJO —but for what I was trying to achieve, even DOJO felt too bloated and seemed liable to create further complications. We can, of course, achieve these layout goals by using JavaScript to resize the div s every time the page is loaded or resized. Unfortunately—among other headaches—that’s made more complicated by the choices between window.innerHeight and document.documentElement.clientHeight and document.body.clientHeight , and the need for cross-browser event listeners. It seems that using JavaScript is an attainable but inelegant solution for this layout.