Probleme mit verschattelter DIV-Anordnung

[Jochen2501]

Hi,
ich hab folgendes Problem, eigentlich ganz einfach...aber irgendwie pack ich es nicht.



So soll es von der Struktur sein.
DIV1: Container, soll automatisch so hoch sein wie DIV2,3,4, breite ist fix, beliebig viele untereinander
DIV2: ist in der Höhe variabel, darf die grenzen von DIV1 aber nicht überschreiten
DIV3+4: Immer gleich hoch und breit

Bei mir ist es aktuell so das DIV2 über DIV1 (nach unten) hinausgeht und so den nachfolgenden DIV1 verschiebt (Float:Left).

Hier mal mein grober Code:

<div style="border:solid 1px;float:clear"> 
    <div style="float:left; width:200px">variabler Text</div>
    <div style="float:left">Bild</div>
    <div style="float:clear">Bild</div>	
</div>

Schonmal danke

PS: Es muss mit DIVs gemacht werden.

[wahsaga]

Re: Probleme mit verschattelter DIV-Anordnung

Original geschrieben von Jochen2501
Bei mir ist es aktuell so das DIV2 über DIV1 (nach unten) hinausgeht

Natürlich, denn durch das floaten hast du DIV2 ja aus dem Fluss genommen.
(Das war dir doch aber hoffentlich vorher klar?)

Lösungen wären bspw., DIV1 ebenfalls zu floaten (falls möglich), oder auch overflow auf hidden (IIRC) zu setzen.

Btw: float:clear, was bei dir im ersten Div steht, gibt es nicht.

[Jochen2501]

Super ! Besten Dank,

bei Overflow:hidden im DIV1 kommt nun alles richtig. Ich verstehe aber noch nicht ganz wieso, da overflow:hidden mir ja eigentlich den überstehenden Text abschneiden sollte?

Das ich DIV2 aus'm normalen Fluss genommen hab war mir klar, aber ich dachte ich würde mit clear:left (was ich dummerweise mit float:clear meinte) wieder aufheben und der Abschluß von DIV1 würde dann nach dem DIV234 Block erfolgen.

Ich muss da echt noch dringend mein Wissen erweitern, gute Quellen die Ihr empfehlen könnt?

[hall]

http://www.css4you.de/

[wahsaga]

Original geschrieben von Jochen2501
bei Overflow:hidden im DIV1 kommt nun alles richtig. Ich verstehe aber noch nicht ganz wieso, da overflow:hidden mir ja eigentlich den überstehenden Text abschneiden sollte?

Weil das genau so in der Spezifikation beschrieben ist.
Lies es nach, wenn es dich interessiert.

Das ich DIV2 aus'm normalen Fluss genommen hab war mir klar, aber ich dachte ich würde mit clear:left [...] wieder aufheben

Um per clear float wieder aufheben zu können, muss das clear auf einem (Block-)Element nach dem gefloateten erfolgen.
Dein Versuch, es direkt im Vorfahrenelement anzuwenden, musste deshalb wirkungslos bleiben.

[Jochen2501]

Original geschrieben von wahsaga
[B]Weil das genau so in der Spezifikation beschrieben ist.
Lies es nach, wenn es dich interessiert.

okay... verstanden hab ich es jetzt, nochmals danke

ich war nur verwundert wegen: hidden
" Der übergroße Inhalt wird abgeschnitten und nicht angezeigt. " ->http://www.css4you.de/overflow.html

Das mit dem Clear:float ist auch logisch.danke