nicht angemeldet
horizontale Linie korrekt positionieren
Hallo,
ich übe gerade CSS und brauche etwas Hilfe. Ich habe meine Seite (hier ein Gif: http://www.BundJ.de/ebay/swebDesing.gif) fix zentriert, und möchte es mit weissen Balken umranden. Li, Re habe ich als Rand und Background-Image gelöst, OBEN als Element ausserhalb des Container, aber UNTEN ist ein Problem.
Der Inhalt des Containers ist ja variabel.
Wie kann ich einen weissen Balken welcher 100% Breite des Viewports einnimmt just unterhalb des Footers setzen?
-
Du könntest nochmal einen Container drumherum packen
<div style="border-bottom: 2px solid white; width: 100%;">
<div id="footer" style="width: 500px; margin: 0px auto;">
footer geblabla
</div>
</div>Aber vermutlich packst du besser gleich den ganzen Mittelteil in einen Container mit nem weißen Rand oben und unten.
<div style="border: 3px solid white; border-width: 3px 0px;">Mittelteil</div>-
Aber vermutlich packst du besser gleich den ganzen Mittelteil in einen Container mit nem weißen Rand oben und unten.
Stimmt, das könnte ich mal versuchen. Ich lass den jetzigen Container mit Breite 750px einfach weg, und platziere über und unter den Mittelteil mit 100% einfach Header und Footer mit fixer Breite.
Allerdings muss ich dann die vertikalen Linien direkt setzten und vom Zentrum aus berechnen. Ich vesuch es mal.Danke.
-
Naja nochmal in einen Container packen oder ...
Das sieht nach Schatten aus, was du da machen willst. Dann könntest du eigentlich ein 1000x1 Pixel Bild für den Hintergrund auf repeat-y machen, wo die vertikalen Linien mit drin sind. Dann nur noch alles zentrieren:
#container * {
background: url(1pixel.png) repeat-y; /* Hintergrund */
border: 3px solid white; border-width: 3px 0px; /* Weiße Ränder oben unten */
margin: 0px auto; width: 750px; /* Inhalt zentrieren */
}-
Was bedeutet denn der "*" zwischen container uund Klammer?
#container * {
.Juergen
-
Tach,
Was bedeutet denn der "*" zwischen container uund Klammer?
das ist der Universal Selector: "Matches any element." Siehe auch: http://www.w3.org/TR/CSS21/selector.html#q1 für die restlichen Selektoren.
mfg
Woodfighter
-
-
-
-