[HTML] Bildzeile unter Bild ohne Tabelle möglich?

[Smaz]

Hey Leute,
heute steh ich mal wieder vor nem kleinen Problem, vielleicht hab ich aber auch einfach nur Tomaten auf den Augen
Und zwar: Ich habe ein Bild, einen längeren Text und eine Bildzeile. Das Bild soll über der Bildzeile stehen, die Bildzeile nur so breit wie das Bild sein und der Text um das Bild und die Bildzeile verlaufen, unter der Bildzeile mit nem kleinen Abstand dann auch nach links einrücken.
Damals hab ich das mal mit ner Tabelle gemacht (so sah das aus und so ähnlich solls auch wieder aussehn:

Diesmal sollte es aber hoffentlich anders gehen, da ich die Textlänge nicht kenne und auch die Stelle für den Umbruch nicht kenne... Bild und Text allein bekomme ich mit

<a href="TollerLink"><img src="Bild.jpg" style="float: left;" hspace="10" vspace="5"></a>Text

hin, aber wo kann ich da nun die Bildzeile unterbringen? Geht das gar nicht? Muss ich mit einer Tabelle arbeiten und somit doch den Text teilen? Oder gibt's noch ne andere Alternative?

 

[theHacker]

Bild+Bildzeile in 'n Div packen und den floaten

<div style="float: left;">
  <img ... /><br />
  Komisches Bild
</div>
umfließender Text

edit:
Dem Div kannstd zusätzlich "text-align: center;" geben, dann steht die Bildzeile in der Mitte des Bilds.

 

[Zman]

Relativ beliebt, weil es zumindest einen kleinen Ansatz von Semantik verfolgt, ist die Definitionsliste:

<dl style="float:left;">
 <dt style="margin:0; padding:0"><img src="" alt="" /></dt>
 <dd style="margin:0; padding:0; text-align:center;">Bildunterschrift</dd>
</dl>

Schön mit css formatiert kann man damit eigentlich gut etwas anfangen.

 

[Smaz]

Hey ihr beiden,
auf den ersten Blick scheint beides zu gehen. Allerdings klappt's nicht mehr, sobald der Text länger als das Bild ist (ist bei mir nur ein Thumb, also relativ klein), dann nimmt die 'Bildunterschrift' eine/zwei ganze Zeilen ein und der Text rutscht erst darunter. Rechts neben dem Bild steht dann gar nichts. Wenn das bei euch auch so ist, wär das ziemlich blöde, da ich auch die Bildunterschrift nicht mit Zeilenumbrüchen versehen möchte Oder hab ich jetzt einfach nur wieder n Fehler drin?

<dl style="float:left;">
 <dt style="margin:0; padding:0"><a href="Bildlink"><img src="Bildlink" width="225" hspace=10 vspace=5 /></a></dt>
 <dd style="margin:0; padding:0; text-align:center;">Bildtext(und zwar ein ziemlich langer, weil man das sonst nicht sieht, dass der nicht umbricht.) Bildtext(und zwar ein ziemlich langer, weil man das sonst nicht sieht, dass der nicht umbricht.) Bildtext(und zwar ein ziemlich langer, weil man das sonst nicht sieht, dass der nicht umbricht.)</dd>
</dl>
Richtiger Text.

 

[theHacker]

Dann musst du die Breite für die Bildunterschrift eingrenzen. Dann bricht die Bildunterschrift vorzeitig um und außenrum kann dein Text noch fließen.

 

[Smaz]

Ah, nun hab ich's. Daaaanke