Div mit Höhe von Image

[MO]

Hallo zusammen.

Ein kleines Problem plagt mich schon seit längerem und taucht immer wieder auf:

Wenn man folgende Konstruktion hat:

<div style="border:1px solid #000;">
  <img src="bild.jpg" width="100" height="100" style="width:100px;height:100px;float:left;" />Hier steht ein Text<br />
</div>

Das div umschließt zwar das Bild, jedoch nur mit der Höhe welche der Text braucht. Wenn nun mehr Text reingeschrieben wird, dann wird das Bild irgendwann eingeschlossen.

Ich möchte jedoch das das Bild immer vom Div umschlossen wird.
Wenn nun nämlich ein weiters div folgt, wird dessen eingeschlossenes Bild nach rechts verschoben bis es wieder unter das Bild passt.

Wenn ich nun vor dem abschließenden </div> ein <br style="clear:left;" /> einbaue, funktioniert es zwar, aber der Firefox hebt dann sämtliche bis dahin eingesetzten floats auf. (Bug?)

min-height funktioniert wiederum beim ie nicht, wenn ich dem div die Höhe des Bildes als min-height mitgebe.....
Mit height gibt es dann ein Problem wenn der Text über die Höhe des Bildes hinaus geht.
Wie macht man dies richtig?
Beispiel:
http://www.silberscheibe.de/ Startseite, die neusten Bilder...

Danke im voraus und Gruß

MO

[wahsaga]

hi,

Das div umschließt zwar das Bild, jedoch nur mit der Höhe welche der Text braucht.

natürlich, schließlich ist das bild mit float aus dem elementfluss genommen.

min-height funktioniert wiederum beim ie nicht, wenn ich dem div die Höhe des Bildes als min-height mitgebe.....
Mit height gibt es dann ein Problem wenn der Text über die Höhe des Bildes hinaus geht.

und height ausschließlich für IE, min-height für die anderen browser?
(über css-hack, conditional comments, ...)

Wie macht man dies richtig?

den div selber ebenfalls floaten zu lassen wäre eine weitere alternative.

gruß,
wahsaga

[MO]

Hi

den div selber ebenfalls floaten zu lassen wäre eine weitere alternative.

Danke. So funktioniert es.

Gruß

MO