Float-Problem: Div bricht aus "Eltern-Div" aus

[Tobias Klein]

Hallo!

Ich habe ein Problem mit der CSS-Formatierung einer Seite.

Der Aufbau ist folgendermaßen:

_______________________________________________________

<div id="content-bereich">

<!-- hier steht der obere content-bereich -->

<div id="content-unten">

<div id="content-unten-links">
      </div>

<table id="content-unten-rechts">
      </table>

</div>

</div>
________________________________________________________

"content-unten-links" ist folgendermaßen formatiert:
________________________________________________________

float:left;
width:18em;
padding-bottom:1em;
margin-right:1em;
border-bottom:2px solid black;
________________________________________________________

Mein Problem: http://tklein.net/problem.jpg (120 KB)

Auf dem Screenshot sieht man, dass ein schmaler Kasten, nämlich das linke untere content-div (id="content-unten-links") aus dem großen content-div herausragt. Das ist aber nicht so von mir gewollt. Warum skaliert das große rahmen-div nicht mit dem gefloateten Kindelement? Lässt sich das irgendwie vermeiden / weiß jemand, was ich falsch mache?

Gruß,
Tobias

[Caliga]

Hallo!

nicht, dass ich alle CSS Eigenarten schon druchschaut hätte, aber es liegt an den verwendeten Elementen.
Wenn du z.B aus

<div id="content-unten">

eine Einzellige Tabelle machst, geht's.
Aber dann könntest du auch gleich ne Tabelle für dein Layout benutzen... Gut, dann gibts vielleicht weniger Probleme mit alten Browsern :)

[Tobias Klein]

Hallo!

nicht, dass ich alle CSS Eigenarten schon druchschaut hätte, aber es liegt an den verwendeten Elementen.
Wenn du z.B aus

<div id="content-unten">
eine Einzellige Tabelle machst, geht's.
Aber dann könntest du auch gleich ne Tabelle für dein Layout benutzen...

Ich glaube nicht, dass es an den verwendeten Elementen liegt. Dass es mit ner Tabelle funzen wurde, weiß ich, ich wollte halt AUCH eine Möglichkeit finden, das ganze mit div's hinzukriegen... Und es gibt mit Sicherheit eine Möglichkeit (die ich eben noch finden muss).

Danke trotzdem für die Anregung,

Gruß
 Tobias

[MudGuard]

Hi,

Auf dem Screenshot sieht man, dass ein schmaler Kasten, nämlich das linke untere content-div (id="content-unten-links") aus dem großen content-div herausragt.

Klar, floatende Teile beeinflussen die Größe der Elternelemente nicht.

Das ist aber nicht so von mir gewollt. Warum skaliert das große rahmen-div nicht mit dem gefloateten Kindelement?

Weil es das (laut CSS-Standard) nicht DARF.

Lässt sich das irgendwie vermeiden / weiß jemand, was ich falsch mache?

Setze nach dem floatenden div z.B. ein <br style="clear:both;"> ins äußere div.

cu,
Andreas