Matthias Kientz: Bilder überlagern in Tabellenzelle

Beitrag lesen

Hallo,

ich habe eine Tabelle, in der ich in einzelnen Zellen überlagerte Bilder(alle gleich groß) anzeigen möchte.

Hier mal ein Beispiel, wie ich mir das gedacht habe:

<html><head>
</head><body>

<table border="1">

<td style="position:relative;">

<div style="position:absolute;">
      <img src="bild1.gif">
   </div>
   <div style="position:absolute;">
     <img src="bild2.gif">
   </div>
   <div style="position:absolute;">
     <img src="bild3.gif">
   </div>

</td>

</tr>
</table>
</body></html>

Die Überlagerung funktioniert, so wie ich es mir vorgestellt habe. Allerdings fliegt mir das Bild bei der Angabe von position:absolute aus der Tabelle raus. Wie kriege ich es hin, dass sich meine absolute Positionierung für die Bilder auf die Tabellenzelle (statt auf die Seite) bezieht? Oder geht das so nicht?

Falls jemand einen ganz anderen Vorschlag hat, wie ich das mit der Überlagerung sauber hinkriege, wäre ich natürlich auch dafür dankbar. Voraussetzung ist aber, dass ich mehr als 2 Bilder auf diese Weise überlagern lassen (background image für die Tabellenzelle kommt daher nicht in Frage).

Danke schonmal für alle Anregungen...