✔ Div felder

[oldputz1990]

Hallo!

Meine Homepage sieht so aus:

http://www.directupload.net/images/070702/Yvf7YtkR.gif

Ich möchte aber, dass der weiße Bereich weiter nach unten geht, sobald der hellblaue Bereich größer wird.

Wie geht das?

Hier die CSS Datei:
Weißer Bereich:

	#main{
	background-color: white;
	width: 736px;
	min-height: 500px; /* Für moderne Browser */
	height: auto !important; /* Für moderne Browser */
	height: 500px; /* Für IE <7 */
	float: center;
	margin-left: 2px;
	padding: 5px;
	}

Hier der Hellblaue Bereich:

#np_hellblau_oben{
	background-image: url(../images/design/nickpage/hellblau_oben.gif);
	width: 512px;
	height: 11px;
	float: right;
	margin-top: 10px;
}

#np_hellblau_mitte{
	background-color: #C2D5F1;
	width: 512px;
	float: right;
	margin-top: 0px;

}

#np_hellblau_unten{
	background-image: url(../images/design/nickpage/hellblau_unten.gif);
	width: 512px;
	height: 11px;
	float: right;
	margin-top: 0px;
}

Ich hoffe ihr versteht was ich meine!

 

[Maik]

Hi,

da es sich bei dem blauen Bereich um eine Float-Umgebung handelt, muß diese auch "gecleart" werden, damit sich die "weiße" Box bei zunehmenden Inhalt nach unten ausdehnt.

Hilfreich dürfte hier http://positioniseverything.net/easyclearing.html sein.

Die in dem Artikel genannte Klasse clearfix wird dann zusätzlich in der weißen Box #main aufgerufen:

<div id="main" class="clearfix">...</div>

Achja, einen Wert center für die float-Eigenschaft gibt es nicht - siehe auch http://edition-w3c.de/TR/1998/REC-CSS2-19980512/kap09.html#heading-9.5.1%A0

 

[oldputz1990]

Hallo!

Das mit dem "clearfix" hat nicht funktioniert, aber ich habe statt dem "float: center", "float: left" eingegeben.

Jetzt funktioniert es! trotzdem ist das design gleichgeblieben. Ich habe keine Ahnung, warum ich das float überhaupt eigebaut habe

 

[Maik]

Ich habe keine Ahnung, warum ich das float überhaupt eigebaut habe

Wenn du es selber nicht weißt, wer dann? :suspekt:

 

[oldputz1990]

naja, solange die Seite im IE und FF funktioniert....