Ich möchte ein Bild am linken Textrand anzeigen umd von dem Text umfliefen lassen. Soweit kein Problem.
Es passiert jedoch immer wieder, dass der Text kürzer als das Bild ist. Die Folge ist, dass das Bild unten aus dem Text und in die nachfolgenden Elemente einfließt:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Test</title>
</head>
<body>
<div style="border: solid 1px black;">
<img src="" style="float:left; width:100px; height:150px; margin: 1em; border: solid 1px red;">
Das ist ein Test,<br />
der sich zwar über mehrere Zeilen erstreckt,<br />
aber im Normalfall kürzer als das Bild ist.
</div>
</body>
</html>
Wie kann ich das Problem lösen?
TIA,
Skyposter