RHO zentrieren
Web to Date Template RHO
Im W2D-Forum gibt es eine Anleitung zum zentrieren von CSS-Designs.
Um das Design RHO von Web to Date zu zentrieren, muss man 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;
Hier können Sie eine druckoptimierte Version dieser Seite ausdrucken.
Um eine Druckvorschau zu sehen, benutzen Sie bitte die Druckvorschau Ihres Browsers.
