Rho zentrieren
Im W2D-Forum gibt es eine Anleitung zum zentrieren von CSS-Designs.
Um das Design RHO zu zentrieren, muss mann aber eine Besonderheit beachten, weil das Bannerfoto eine zusätzliche Hintergrundgrafik hat, die hartnäckig am alten Platz bleiben will. Das liegt daran, dass diese Grafik als Hintergrundgrafik für die ganze Seite eingebunden ist. Gehen Sie bitte wie folgt vor:
Öffnen Sie die Datei navigation.ccml. Direkt unterhalb des Eintrags <body> tragen Sie folgendes ein:
<div id="zentrieren">
<div id="logoback"></div>
Dann ganz unten über </body>:
</div> <!--ENDE Zentrieren-->
Dann öffnen Sie die Datei style_content.css. Unterhalb des #body Eintrags geben Sie folgendes ein:
#zentrieren {
position: absolute; /*wichtig*/
top: 0px;
left: 50%; /*wichtig*/
margin: 0 -500px; /*wichtig*/
width: 1000px;
height: 100px;
}
Jetzt ist noch die Hintergrundgrafik des Headers verrutscht. Dazu löschen Sie beim #BODY Eintrag folgendes:
url(../images/<cc:print value="&pic.back.filename">
Dann öffnen Sie die Datei style_design.css. Geben Sie oberhalb des #logo Eintrags folgendes ein:
#logoback {
position: absolute;
width: 1002px;
height: 240px;
background : url(../images/<cc:print value="&pic.back.filename">) no-repeat;
z-index: 80;
}
Unterhalb der Zeile #logo { geben Sie ein:
z-index: 81;
Jetzt ist noch die Menüleiste im Hintergrund. Die wird nach vorne geholt, indem unterhalb der Zeile #nav { folgendes eingegeben wird:
z-index: 82;
(C) 2010 - Alle Rechte vorbehalten