afra: weißer Hintergrund

Beitrag lesen

Hallo Robert

Ich versuche Dir mal zu erklären was das Problem ist:

Wenn Du, wie Du es gelöst hast, in einem Div Elemente floaten lässt, dann hat das umschliessende Element keine Höhe mehr. Du musst als nach den floatenden Elementen einen clear: both/left/right unterbringen, damit die Browser dem umschließenden Element wieder eine Höhe geben. Unschön, aber machbar ist das mit einem <div style="clear:both;" />

Um den Effekt zu testen solltes Du einfach einmal in ein Testdokument aufbauen, das nur aus dem relevanten Code besteht:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
 <title>Untitled</title>
 <style type="text/css">
 body {background-color: white;}
 #container {border: 1px solid red;width: auto;}
 #eins {float: left;width: 100px;height: 30px;border: 1px solid green;}
 #zwei {float: left;width: 100px;height: 30px;border: 1px solid blue;}
 #drei {float: left;width: 100px;height: 30px;border: 1px solid gray;}
 </style>
</head>
<body>
<div id="container">
<div id="eins"></div>
<div id="zwei"></div>
<div id="drei"></div>
<div style="clear: left;" />
</div>
</body>
</html>

Wenn Du jetzt den "clearenden" Div entfernst, oder wieder rein nimmst, siehst Du was ich meine ;o)

Schönen Gruß