Auf der Suche nach der Möglichkeit ein Div horizontal und vertical auf der Seite zu zentrieren bin ich auf diese Seite gestossen die einige Möglichkeiten samt Pro und Kontra auflistet: http://blog.themeforest.net/tutorials/vertical-centering-with-css/
Ich hab mich aufgrund der Cross-Browser Anforderung für Methode 3 entschieden. Mit ein paar kleinen Änderungen Dabei baut man vor seinen Hauptcontainer/wrapper ein zusätzliches DIV ein das den Container nach unten verschiebt:
<div id="spacer"></div> <div id="container"> Seiteninhalt </div>
Mit folgendem CSS erreicht man danach, dass die Seite zentriert wird und falls der Seiteninhalt größer als das Browserfenster ist wird ein Scrollbar eingeblendet.
html, body {
height:100%;
}
#spacer {
float:left;
height:50%;
width:1px;
margin-bottom: -350px;
}
#container {
clear:both;
position:relative;
margin:0 auto;
height:700px;
width:1366px;
}
Ich hab zusätzlich noch folgenden Doctype benötigt:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
weil mit meinem Standart Doctype „<!DOCTYPE html>“ wollte es nicht so richtig.