Zentriertes, 100% hohes DIV mit Hintergrundbildern und DIVs

[Marc]

Hallo Matze,

danke für die superschnelle Antwort.

Dafür hat es diesmal umso länger gedauert... :-(

Wenn ich das so versuche, sieht die Nummer bei mir so aus:

Es ist zwar alles zentriert, aber das Hintergrundbild der content-area ist nicht sichtbar und das PADDING wird links nicht berücksichtigt.

Wenn das Hintergrund-Bild nciht sichtbar ist, wird irgendetwas falsch sein - Dein CSS scheint mir richtig zu sein - stimmen die Pfade? Groß-Kleinschreibung?

Kann ich mir das mal irgendwo "live" ansehen? - Statt der Bilder hättest Du lieber den Code zum DL angeboten... ;-)

Der Content-Bereich ist auch ein wenig kompliziert: Zunächst soll dort ein Hintergrundbild von 700px Höhe abgebildet werden. Sind Bildschirm oder abzubildender Content länger, soll sich daran ein per repeat-y wiederholtes 1px hohes Hintergrundbild anschließen.

Wenn Du zwei Hintergrund-Bilder benutzen willst, brauchst Du zwei Elemente. Das heißt du brauchst ein contentWrap und ein content oder so - gib dem inneren Element das ein Pixel hohe image mit und gib an:

  
min-height:700px;  
background-position:left 700px;  
background-repeat:repeat-y;  

Für das Äußere div (z. B. #contentWrap) gibst du das 700 px hohe Bild als Hintergrund an, aber keine Höhe.

Paddings werden horizontal addiert! Wenn Dein div so breit ist wie die anderen, bekommt es links und rechts ein padding hinzugefügt (nicht abgezogen!) - es sei denn du hast den IE in den Quirks-Modus geschickt.

Installier dir mal den Firebug für den Firefox und guck dir die Dimensionen der einzelnen DIVs an...

TRANSITIONAL ist übrigens nicht zwingend erforderlich. Sehr alte Browser müssen auch nicht unterstützt werden.

Dann mach doch STRICT - Transitional braucht man eigentlich nur für iFrames und target...

Herzlichen Dank!

Gerne! - Ich hoffe, es wirkt. :-)

Viele Grüße,
Marc.