Tabellen/CSS-Problem

[Peter]

Hallo,
Ich habe bei dem Codeausschnitt unten folgendes Problem: Ist der Text in der zweiten Zeile zu lang, verbreitert sich der äußere DIV-Container. Wie kann ich, ohne die Bildbreite explizit anzugeben, bewirken, dass der Text unter dem Bild umgebrochen wird?

<div class="margin-right: 12px; margin-bottom: 8px; float: left;">
  <table border="0" cellspacing="0" cellpadding="0">
    <tr>
      <td>
        <img style="margin-bottom: 8px;" src="bild.png">
      </td>
    </tr>
    <tr>
      <td>
        <span class="font-size: 11px;">Langer Beschreibungstext</span>
      </td>
    </tr>
  </table>
</div>

[Peter]

Ich hoffe ihr könnt mir helfen.

Vielen Dank im Vorraus,

Peter

[opi]

Hallo Peter,

<div class="margin-right: 12px; margin-bottom: 8px; float: left;">
        <span class="font-size: 11px;">Langer Beschreibungstext</

du hast aber wirklich sehr, sehr seltsame Klassen definiert ;-)

Ach ja... nicht drängen, dann bekommste auch ne Antwort.

Greez,
opi

[Der Martin]

Moin!

Ich habe bei dem Codeausschnitt unten folgendes Problem: Ist der Text in der zweiten Zeile zu lang, verbreitert sich der äußere DIV-Container.

Wobei sich die Frage aufdrängt: Wozu dient der überhaupt? Oder anders gefragt: Was hat die Tabelle hier zu suchen? Die ist doch nun wirklich vollkommen überflüssig!

Setze das Bild und die Bildunterschrift gemeinsam in ein div, um sie zusammenzuhalten, und verzichte auf das Tabellengewurschtel.

<div class="margin-right: 12px; margin-bottom: 8px; float: left;">

Hier hast du -wie opi schon so nett andeutete- wirklich seltsame Klassen. Ich vermute, du meintest "style" und nicht "class". Besser wäre es trotzdem, den Elementen eine id oder class zu geben, wo es notwendig ist (das ist es nicht immer!), und die Formatierungen in einen <style> Bereich im Head oder in eine separate CSS-Datei auszulagern.

Wie kann ich, ohne die Bildbreite explizit anzugeben, bewirken, dass der Text unter dem Bild umgebrochen wird?

Normalerweise wird Text automatisch umgebrochen, wenn er die Breite des umgebenden Elements überschreitet. Dazu brauchst du also gar nichts zu tun.

<img style="margin-bottom: 8px;" src="bild.png">

Hier fehlt auf jeden Fall ein alt-Attribut.
Schönen Tag noch,

Martin