Axel Richter: 3 Boxen nebeneinander

Beitrag lesen

Hallo,

Wie breit ist bei Dir das IMG-Element im mittleren DIV-Element? Und wenn das DIV-Element schmal genug ist, verschmälert sich das IMG-Element dann auch? Wenn es das tut, aus welchem Grund tut es das dann?

Die Breite des Bildes ist fast 30% der für die drei Boxen zur Verfügung stehenden Breite.
Wenn ich das Div-Element z.B auf 20% verschmälere, bleibt das IMG gleich groß und der Text rechts davon geht in das Bild hinein.

Das passiert so in einigen Browsern, je nachdem, wie sie overflow:visible umsetzen. Im IE passiert das, was Du im ersten Posting beschrieben hast:

Wenn ich das Fenster verkleinere, verkleinern sich die linke und die rechte box, nicht aber die mittlere. Irgendwann springt dan die rechte box nach unten.

Wenn das mittlere DIV-Element nicht den vollen Inhalt anzeigen, bzw. sich nicht auf die Breite des IMG-Elements, also seines breitesten Inhalts, ausdehnen soll, kann
entweder
a) das IMG-Element schmaler werden, wenn das DIV-Element schmaler wird. Das kann man erreichen, indem man dem IMG-Element eine Breite von 100% per CSS zuweist. Da sich das IMG-Element im DIV-Element befindet, beziehen sich die 100% auf die Breite des DIV.
oder
b) das DIV-Element nicht mehr den gesamten Inhalt zeigen, wenn es zu schmal dafür geworden ist. Das passiert per overflow:hidden für das DIV-Element.

viele Grüße

Axel