Wer hat es noch nicht erlebt, dass ein Hintergrundbild, welches mittels CSS vertikal und horizontal zentriert wurde, im IE6 exakt dargestellt
wird, jedoch die Ansichten im Firefox und anderen CSS-fähigen Browsern völlig falsch sind.
Abhilfe schaffen folgende Punkte im Stylesheet:
1. Entfernen von allen störenden Innen- und Außenabständen: * { margin:0; padding:0; }. * = Wildcard
2. Das Dokument benötigt eine vordefinierte Höhe. Somit geben wir dem HTML-Tag folgendes mit: html { height:100%; }
3. Anschliessend können wir das Bild für den Body-Bereich definieren:
body { background:url(BILDPFAD) center center no-repeat; }
An dieser Stelle befindet sich die eigentliche Bildausrichtung. Durch die Attribute “center center” wird dem Browser eine
vertikale und horizontale Ausrichtung vorgeschrieben.
4. Nun einmal den Browserfenster “refreshen” und siehe da, der Anzeigefehler wurde behoben.
Vielen Dank an dieser Stelle an Chris Stevens dem Pixielaner, dem Autor dieses Artikels . Falls der werte Herr seine Homepage mal fertigstellen sollte, dann werdet ihr Ihn auch unter den Partnern von CSS-Roots finden.
