DIV-Box Höhe 100%

Besitzt das <body>-Element ein Hintergrundbild?

Wenn nicht, erhält es das von #wrapper, und #wrapper das von #body.

mfg Maik
 
Ja das <body>-Element hat ja den Verlauf als Hintergrund und darauf sollten ja im #wrapper die weißen Punkte und im
#body der dunkelgraue Hintergrund, der bis nachunten gehen sollte, egal wieviel/wenig Text drin ist.

Gruß
Simon
 
Dann sieht's für dein Vorhaben schlecht aus.

Letzte Möglichkeit, die da bliebe, die beiden Hintergrundbilder von #wrapper und #body zu einer Grafikdatei vereinen, und diese für #wrapper nutzen.

mfg Maik
 
Aber dann würden sich die weißen Punkte ja auch wiederholen und die sollen ja nur einmal im oberen Bereich dargestellt werden.
Dann muss ich die weglassen oder mir irgendwie was anderes einfallen lassen.

Hätte ich anstelle des Verlauf nur eine Farbe im <body>-Element könnte ich die mit den Punkte verpacken und dann bg-color einsetzen.
Das müsste gehen, aber dann hätt ich den Verlauf leider nicht mehr.

Gruß
Simon
 
Aber dann würden sich die weißen Punkte ja auch wiederholen und die sollen ja nur einmal im oberen Bereich dargestellt werden.
Für dieses nicht zu wiederholende Hintergrundbild wird sich dann ja wohl ein anderes Element im Markup finden bzw. einrichten lassen, damit der Hintergrund von #body in #wrapper genutzt werden kann.

mfg Maik
 
Ok, ich komm jetzt langsam nicht mehr so richtig mit ;)

Also wie folgt sieht es jetzt bei mir aus:

CSS:
Code:
html, body		{ height:100%; font-family:Verdana, Arial, Helvetica, sans-serif; color:#ffffff; font-size:12px; background:url(../images/bg01.jpg) repeat-x #dfe0e3;
#wrapper		{ width:803px; margin:0 auto; min-height:100%; height:auto !important; height:100%; background:url(../images/bg02.gif) repeat-y; }

Im <body> hab ich bg01.jpg -> ist der Verlauf der sich nach rechts und links ausbreitet.
Im #wrapper hab ich bg02.jpg -> der dunkelgraue Hintergrund der sich nach unten ausbreitet.

Den #body hab ich jetzt gelöscht.

Wie könnt ich jetzt das mit den Punkten einrichten?
Mit einer neuen DIV, die irgendwie noch hinter dem #wrapper plaziert wird und immer an der selben Position ist?

Gruß
Simon
 
Jo, ich komm' bei deinen wechselnden Grafikdateinamen u. -typen auch bald nicht mehr mit :p

Wie wäre es mit #head?

Dürfte der erste Block sein, der im Markup nach #wrapper folgt, und somit ganz oben sitzt.

mfg Maik
 
Ne #head ist schon vergeben.
Hier noch mal in kurz Form was ich schon hab:

CSS:
Code:
#wrapper		{ width:803px; margin:0 auto; min-height:100%; height:auto !important; height:100%; background:url(../images/bg02.gif) repeat-y; }
#head			{ width:803px; height:251px; padding:10px 0px 0px 0px; background:#727783; }
#navi			{ width:801px; height:32px; margin:0px 1px 0px 1px; background:url(../images/bg03.jpg) repeat-x; float:left; }
#content		{ width:763px; padding:20px; }
#leftcolumn		{ width:537px; float:left; padding-top:20px; }
#rightcolumn	{ width:187px; float:right; display:inline; position:relative; padding-top:20px; }

#wrapper ist der zentrierte Hauptbereich, in dem sich dann #head, #navi und #content untereinander befinden.

#left- und rightcolumn sind hinterher im #content Div.

So sieht es zur Zeit bei mir aus.

Gruß
Simon
 
Ne #head ist schon vergeben.

Code:
#wrapper		{ width:803px; margin:0 auto; min-height:100%; height:auto !important; height:100%; background:url(../images/bg02.gif) repeat-y; }
#head			{ width:803px; height:251px; padding:10px 0px 0px 0px; background:#727783; }
Ein bisschen mehr Einfallsreichtum darfst du hier schon ruhig an den Tag legen.

Ich weiß eine weitere Lösung, aber die werde ich dir jetzt nicht auf dem Silbertablett liefern, sondern nur einen Tipp in den Raum werfen, der deine Gehirnmuskeln aktivieren soll: #wrapper und #head werden breiter.

mfg Maik
 
Meinst du ich soll die weißen Punkte mit in den #head-Bereich aufnehmen?

Was nicht gehen würde, da sie so plaziert sind, das sie im navi- und content-Bereich auch noch sind.

Nachtrag:
Kann man nicht links und rechts eine zusätzliche DIV-Box machen, in der sich die Grafiken befinden?

Gruß
Simon
 

Anhänge

  • bild2.jpg
    bild2.jpg
    30 KB · Aufrufe: 19
Zuletzt bearbeitet:

Neue Beiträge

Zurück