Bild floaten, aber in DIV
0 0 
Detlef G.
Bild floaten, aber in DIV
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
-
Schreibe in das nachfolgende Element style="clear:left".
Dann müsste dein Problem behoben sein. -
Hallo skyposter
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:
Wie kann ich das Problem lösen?
Es gibt mehrere Möglichkeiten. Welche für dich (auch abhängig vom Rest der Seite) die günstigste ist, musst du selbst entscheiden.
Du kannst dem Div eine Mindesthöhe mit der Höhe des Bildes geben. (Nur für ältere IEs stattdessen height, was sich dort wie min-height verhält.)
Zu den anderen Möglichkeiten lies mal dieses Posting und dieses.
Auf Wiederlesen
Detlef--
- Wissen ist gut
- Können ist besser
- aber das Beste und Interessanteste ist der Weg dahin!