Text über einem Bild passgenau plazieren

[Detlef G.]

Hallo nobbi

Es ist eine Tabelle, die mit Daten (unter anderm Bilder) gefüllt wird.
Mit reinem Design hat das nichts zu tun.

Wirklich tabellarische Daten?
Also, wie lauten die Spaltenüberschriften?
Oder werden die Daten, nur fünfspaltig dargestellt und eine Anzeige in ein, zwei oder acht Spalten wäre auch denkbar?
(Ist es eventuell eher eine Auflistung von Daten?)

Sorry, dass ich so darauf herumreite - die Verwendung einer Tabelle benötigt jeweils ein zusätzliches Element.

Die Seite läuft auf einem lokalen Webserver und ist somit leider nicht von aussen zu sehen.

Bedeutet das eine homogene Umgebung, so dass du die Verwendung bestimmter Browser ausschließen kannst?

In den Zellen der Tabelle sind zum Teil Symbole (png's) und Texte eingefügt.

Also sind die Symbole selbst der Inhalt, der eventuell durch Text ergänzt wird.
Damit fällt die einfache Verwendung dieser als Hintergrund weg.

Die Bilder haben immer die selbe Breite von 80 Pixeln und eine Höhe im Raster von n*40 Pixeln. Die Zellenhöhe richtet sich nach der Höhe der Bilder.

Also eine feste Breite und variable Höhe. Entspricht die Bildbreite auch der Spaltenbreite oder sind diese breiter?

Allerdings stehen Höhe und Breite auch in der Datenbank.
Ebenfalls in der Datenbank steht die Information ob überhaupt und wenn ja, wo ein Text auf das Symbol geschrieben werden soll. Eine Art Kennzeichnung, die von der Applikation berechnet wird.

Diese Daten stehen dir zum Generieren des HTML-Dokument alle zur Vefügung?

So, genug der Fragerei.

Eine Tabellenzelle mit Text müsste damit es funktioniert ungefähr so aussehen:
<td><div><p style="left:x;top:y;">Ein Text</p><img …></div></td>
(x und y jeweils die Position mit Einheit - px)

Das zentrale CSS dazu:

td div {  
  position: relative;  
}  
td div p {  
  position: absolute;  
  margin:0;  
  padding:0;  
}  

Auf Wiederlesen
Detlef