Das vorliegende Layout ist in 3 Bereiche (Header, Content, Footer) gegliedert
Jeder einzelne Bereich erstreckt sich über die gesamte Breite. Für den Header und den Footer wurde eine feste Höhe (50px) festgelegt.
Die Besonderheit ist, dass sowohl Header als auch Footer auch sichtbar bleiben, egal wieviel Inhalt sich im Content befindet bzw. unabhängig von der Größe der Anzeige des Endgerätes.

header
top:0px; - Ausgangspunkt des Headers ist der obere Rand des Browsers
position:fixed !important; - sorgt für eine feste Positionierung des Headers
position:absolute; - feste Positionierung für ältere Browser, die position:fixed noch nicht verstehen
line-height. 50px - mit line-height wird der Text gleichzeitig vertikal mittig angeordnet, Höhe als fester Wert
height:10em; - die Höhe wird in em definiert und nicht als Prozentwert, da sonst die dynamische Berechnung der Position für den IE6 nicht funktioniert.
z-index:10; - ein z-index > 1 sorgt dafür, dass der Bereich beim scrollen nicht vom nachfolgenden Content überdeckt wird

nav
bottom:0px; - die Navigation liegt innerhalb des Headers an der unteren Kante
position:absolute; - die Positionierung an der Unterkante des Headers erfolgt absolut

content
top:10em; - der Content beginnt um die Höhe des Headers versetzt nach unten
position:relative; - die Positionierung erfolgt relativ zum vorherigen Element (dem Header)
padding-bottom:3em; - sorgt, bei einem 3em hohen Footer dafür, dass auch die letzte Zeile des Contentbereiches noch sichtbar ist
height:1200px; - sorgt dafür, dass ein Scrollbalken entsteht, da die höhe i.d.R. größer ist als die Bildschirm-Anzeige

footer bottom:0px; - der Footer wird am unteren Rand des Browsers positioniert position:fixed !important; - sorgt für eine feste Positionierung des Footers position:absolute; - die Positionierung an der Unterkante des Browserfensters erfolgt absolut