Bild in Tabellenzeile textumflossen unten positionieren
Hallo, ich möchte in einer Tabellenzeile ein Bild jeweils textumflossen rechts unten positionieren, der Text wird dynamisch befüllt und hat somit flexible Länge.
Wenn ich ein Bild textumflossen rechts oder links oben positionieren mag, geht das wie folgt:
<td><img src="..." align="left/right"> Text ..... </td>
also hatte ich gehofft, daß es entsprechend nun für die untere Position wie folgt geht:
<td> <img src="..." align="left/right" valign="bottom">Text </td>
Leider wird das valign="bottom" offenbar ignoriert bzw. nicht bzgl. der Tabellenzelle interpretiert: das Bild positioniert sich oben rechts bzw. links.
Wenn ich die Reihenfolge vertausche,
<td> Text <img src="..." align="left/right" valign="bottom"></td>
dann erscheint das Bild leider nicht textumflossen, sondern erst nach einem Zeilenumbruch hinter dem Text => auch das ist nicht gewollt!
Das gewünschte Ergebnis kriegt man im Trial-und-Error scheinbar nur mit
<td> Teiltext1 <img src="..." align="left/right"> Teiltext2</td>
aber da der Text wie gesagt dynamisch eingespielt wird, ist trial-and-error nicht möglich. Auch alle Lösungen, die die Tabelle nochmal in Unterzeilen/reihen aufteilen, würden eine Kenntnis des Textes voraussetzen.
Gibt es vielleicht mithilfe von CSS Positionierungsmöglichkeiten? Sowas wie
<td><div><img style="position:...."> Text </div></td>
vielleicht, d.h. kann ich das <div> zum Elternelement erklären und dem Image diesbezüglich eine bottom:0,right:0 mitgeben (die Größe des Bildes ist vorher auch NICHT bekannt, auch dies wird flexibel eingespielt und soll seine jeweilige Größe behalten)
Dankbar für Tipps, Lava
Wenn ich ein Bild textumflossen rechts oder links oben positionieren mag, geht das wie folgt:
<td><img src="..." align="left/right"> Text ..... </td>
also hatte ich gehofft, daß es entsprechend nun für die untere Position wie folgt geht:
<td> <img src="..." align="left/right" valign="bottom">Text </td>
Leider wird das valign="bottom" offenbar ignoriert bzw. nicht bzgl. der Tabellenzelle interpretiert: das Bild positioniert sich oben rechts bzw. links.
Wenn ich die Reihenfolge vertausche,
<td> Text <img src="..." align="left/right" valign="bottom"></td>
dann erscheint das Bild leider nicht textumflossen, sondern erst nach einem Zeilenumbruch hinter dem Text => auch das ist nicht gewollt!
Das gewünschte Ergebnis kriegt man im Trial-und-Error scheinbar nur mit
<td> Teiltext1 <img src="..." align="left/right"> Teiltext2</td>
aber da der Text wie gesagt dynamisch eingespielt wird, ist trial-and-error nicht möglich. Auch alle Lösungen, die die Tabelle nochmal in Unterzeilen/reihen aufteilen, würden eine Kenntnis des Textes voraussetzen.
Gibt es vielleicht mithilfe von CSS Positionierungsmöglichkeiten? Sowas wie
<td><div><img style="position:...."> Text </div></td>
vielleicht, d.h. kann ich das <div> zum Elternelement erklären und dem Image diesbezüglich eine bottom:0,right:0 mitgeben (die Größe des Bildes ist vorher auch NICHT bekannt, auch dies wird flexibel eingespielt und soll seine jeweilige Größe behalten)
Dankbar für Tipps, Lava
15.01.2009 13:03
Mit der CSS-Eigenschaft position könnte man das Bild zwar verschieben, aber es würde dann den Text überdecken und unten gäbe es dann vermutlich einen leerer Raum.
In CSS wird zum Floaten die Eigenschaft float verwendet - aber auch diese sorgt nur für einen Textumfluss von oben nach unten. Das würde also zu so einem Resultat führen:
Das was du suchst, ist aber ja wohl ein Textumfluss von unten nach oben:
Dafür kenne ich leider auch keine Lösung.
In CSS wird zum Floaten die Eigenschaft float verwendet - aber auch diese sorgt nur für einen Textumfluss von oben nach unten. Das würde also zu so einem Resultat führen:
Text Text Text
Text Text Bild
Bild
Das was du suchst, ist aber ja wohl ein Textumfluss von unten nach oben:
Text Text Text
Text Text Bild
Text Text Bild
Dafür kenne ich leider auch keine Lösung.
15.01.2009 13:35
richtig, sowas würde ich suchen :(
18.01.2009 19:53
Beitrag schreiben (als Gast)
Beim Verfassen des Beitrages bitte die Forenregeln beachten.
| Thema | Autor | Forum | Beiträge | Letzter Beitrag |
|---|---|---|---|---|
| Bild und Text nach unten bündig mit CSS positionieren | lava | (X)HTML und CSS | 4 | 04.03.2009 10:59 |
| Frames durch Tabellen ersetzen | lava | (X)HTML und CSS | 25 | 24.03.2007 14:21 |
| Probleme mit mp3 Sound und Programm G-ta WebContent | Titus05 | (X)HTML und CSS | 11 | 17.02.2007 21:25 |
| Fototicker | lava | JavaScript | 20 | 21.01.2007 12:23 |
