nicht angemeldet
Positionierung
<table width=100% CELLSPACING=0 CELLPADDING=0>
<colgroup>
<col span="7" width="14,3%"/>
</colgroup>
<tr>
<td><img src="{$url}img/1.gif" name="austausch1" alt="" onMouseover="an(austausch1,1)"></td>
<td><img src="{$url}img/1.gif" name="austausch2" alt="" onMouseover="an(austausch2,2)"></td>
<td><img src="{$url}img/1.gif" name="austausch3" alt="" onMouseover="an(austausch3,3)"></td>
<td><img src="{$url}img/1.gif" name="austausch4" alt="" onMouseover="an(austausch4,4)"></td>
<td><img src="{$url}img/1.gif" name="austausch5" alt="" onMouseover="an(austausch5,5)"></td>
<td><img src="{$url}img/1.gif" name="austausch6" alt="" onMouseover="an(austausch6,6)"></td>
<td><img src="{$url}img/1.gif" name="austausch7" alt="" onMouseover="an(austausch7,7)"></td>
</tr>
</table>
Hi hab hier einige Bilder in ner Tabelle, die sich je nach der Fensterbreite an ne anderen Stelle stellen. Jetzt möchte ich über jedes Bild einen Text legen, der immer 10px nach rechts und 20 px nach unten von der linken, oberen Ecke des Bildes entfernt sein.
Wie mach ich das?
Thomas
-
Hallo,
<td><img src="{$url}img/1.gif" name="austausch1" alt="" onMouseover="an(austausch1,1)"></td>
Hi hab hier einige Bilder in ner Tabelle, die sich je nach der Fensterbreite an ne anderen Stelle stellen. Jetzt möchte ich über jedes Bild einen Text legen, der immer 10px nach rechts und 20 px nach unten von der linken, oberen Ecke des Bildes entfernt sein.
Wie mach ich das?
Das Bild muss in einem Element stehen, welches eine CSS-position-Eigenschaft abweichend von static hat. Das geht mit TD nicht. Die Bilder müssen also z.B. in P-Elemente. Diese können dann position:relative bekommen. In die P-Elemente schreibst Du die Texte in SPAN-Elemente, die mit position:absolute; top:20px; left:10px; ausgerichtet werden können. Damit für P nicht die Browser-Standards für margin und padding gelten, setzt Du diese auf 0.
CSS:
td p {position:relative; margin:0; padding:0;} td p span {position:absolute; top:20px; left:10px;}HTML:
... <td><p><img src="./img/1.gif" name="austausch1" alt="" onMouseover="an(austausch1,1)"><span>Text über Bild</span></p></td> ...viele Grüße
Axel