• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Problem mit divs

Status
Für weitere Antworten geschlossen.

toom

Neues Mitglied
Schaut mal bitte folgendes CSS Zeug:
Code:
<html>	
	<body>
	<div style="background-color:cyan;border:black solid 1px;">
                <!-- Anfang inneres Zeug -->
		<div style="width:100px;height:100px;float:left;border:red solid 1px;"></div>
		<div style="width:100px;height:100px;float:left;border:red solid 1px;"></div>
		<div style="width:100px;height:100px;float:left;border:red solid 1px;"></div>
		<div style="width:100px;height:100px;float:left;border:red solid 1px;"></div>
		<div style="width:100px;height:100px;float:left;border:red solid 1px;"></div>
		<div style="width:100px;height:100px;float:left;border:red solid 1px;"></div>
                <!-- Ende inneres Zeug -->
	</div>
	</body>
</html>

Das Problem:
Das div, das das innere Zeug umschließt passt sich nicht der Länge/Höhe des inneren Zeugs an. Es wird nur der Rahmen gezeichnet und mehr nicht.

Erst wenn ich folgendes mache, wird es auch so dargestellt wie ich es wünsche
Code:
<html>	
	<body>
	<div style="height:200px;background-color:cyan;border:black solid 1px;">
                <!-- Anfang inneres Zeug -->
		<div style="width:100px;height:100px;float:left;border:red solid 1px;"></div>
		<div style="width:100px;height:100px;float:left;border:red solid 1px;"></div>
		<div style="width:100px;height:100px;float:left;border:red solid 1px;"></div>
		<div style="width:100px;height:100px;float:left;border:red solid 1px;"></div>
		<div style="width:100px;height:100px;float:left;border:red solid 1px;"></div>
		<div style="width:100px;height:100px;float:left;border:red solid 1px;"></div>
                <!-- Ende inneres Zeug -->
	</div>
	</body>
</html>

Problem wieder beim letzten Teil. Ist die Länge/Höhe des inneren Zeugs variable, kann sich das äußere div dem nicht anpassen und es sieht nicht gut aus.

Weiß jemand wie man es anstellt, dass sich die Höhe des äußeren Divs dem inneren Zeug anpasst?
 
Da du das innere "Zeug" floatest musst du noch "clear" verwenden um das floaten aufzuheben - erst dadurch erhält das umgebende "Zeug" auch eine Höhe.
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben