Hintergrundgestalltung mit css

[ferby]

Hello,

ich brauch mal ein wenig css Hilfe.

Also ich soll eine Seite machen die folgenden Hintergrund hat


----------------
-W- -
-E- Grau -
-i- -
-ß- -
----------------


Also einen kleinen weißen Streifen ganz links, der eine fixe Breite hat (height 100% width 20px),
und der rest soll grau sein (height 100% width 100%-20px).

Wie stell ich das am besten an?

[3_of_8]

Ein div mit float: left; width: 20px; height: 100%; und background-color: white; und dann einer mit height: 100%; und background-color: gray; (oder grey, kann mir das nie merken). Am Ende noch einer mit clear: both;

[ferby]

thx, werd ich mir mal angucken

[Pfoto]

Hallo ferby,

bedenke nur, dass 100% Höhe bedeuten, dass beim Scrollen
nach unten (falls mehr Inhalt vorhanden ist), der weiße
Streifen eben nicht bleibt.
Dazu müsste er auf "position: fixed;" stehen, was der IE =< 6
nur im body Element kennt.

Ich würde eher den Hintergrund weiß lassen und einen Inhalt
mit "min-height: 100%;", so wird die graue Fläche bei mehr
Inhalt autom. erweitert.
Der IE <= 6 kennt zar kein Min-Height, interpretiert aber
"zum Glück" "height: 100%;" praktisch als Mindesthöhe.

Gruß
Pfoto

[Thorben77]

Mal ein wesentlich einfacherer Vorschlag ohne Zusatzmarkup:

Nimm ein 20px breites Bild mit weißer Farbe gefüllt (oder das Bild aus dem Anhang) – die Höhe ist egal – und gib es dem body-Element als links ausgerichtetes und vertikal wiederholtes Hintergrundbild und leg als Hintergrundfarbe das Grau fest:

Code:

body {
  background: url("Adresse/des/Hintergrundbildes/Hintergrundbild.png") repeat-y left #CCC;
}

Funktioniert in jedem CSS-fähigen Browser und ist absolut idiotensicher.