nicht angemeldet
Absolute Positionierung in Tabellenzellen
Hallo zusammen,
z.Zt. arbeite ich an einem Komplexpraktikum, bei dem Dokumente mittels XSLT von XML in xHTML transformiert werden. Dabei sollen für ein Layout, das OverlayLayout, mehrere Komponenten übereinander angezeigt werden. Soweit sogut.
Wir haben das mittels span Tags und absoluter Positionierung erreicht. Zudem kann der XML Author für die Komponenten noch Werte für top und left angeben, die dann im CSS gesetzt werden. Nun das Problem:
Ansich klappt das alles wunderbar, nur hat man z.B, eine Tabelle, wo in der ersten Zeile ein solches OverlayLayout vorhanden ist, so geht die Positionierung nicht vom linken oberen Zellenrand von statten, sondern vom Body, also der linken oberen Seitenecke. Damit werden Komponenten, die eigentlich in der ersten Zeile definiert sind, ausserhalb der Tabelle angezeigt.
Ich hab schon sämtliche Positionierungsarten probiert aber nichts funktioniert. Eigentlich sollte sich doch position:absolute auf das Elternelement, das td-Tag beziehen, oder?
Hier mal ein stark vereinfachtes Beispiel, stört euch bitte nicht an den verschachtelten Tabellen, das läßt sich bisher nicht anders lösen bei verschachtelten Layouts:
.
.
<body>
<table width="100%" border="0" cellspacing="1">
<tr width="100%">
<td align="left" valign="center" colspan="2">
<table border="0" cellspacing="0">
<tr>
<td align="right" valign="center" width="10%">
<img src="./irgendwas.gif" width="115" height="49">
</td>
<td align="left" valign="center" width="90%">
<!-- ZELLE MIT OVERLAYLAYOUT -->
<span style="position:absolute; top:0; left:0">
<img src="./bilder_mmt/top_nav_bg.gif" width="1000" height="49">
</span>
<span style="position:absolute; top:5; left:10">
<strong>Suchen | Sitemap | English</strong>
</span>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
In der zweiten Zelle sollte ein Bild hinter einen Text gelegt werden, und zwar wie oben beschrieben. Die beiden werden aber ausserhalb der ganzen Tabelle angezeigt.
So, ich hoffe das war einigermassen verständlich ;)
Was kann man da tun?
-
Habe mir den Code geschnappt und mal probiert.
<body style="margin-left:0px;margin-top:0px>
Dann geht's. Du könntest aber auch ein span um die tabelle machen.
-
nope, das mein ich nicht.
da wir ich mit xsl arbeite werden also für die templates gewisse regeln definiert. das overlaylayout wird mittels span tags umgesetzt.
es geht darum, in der kommentierten tabellenspalte es irgendwie hinzubekommen, die beiden komponenten (text und bild) übereinander darzustellen, und zwar mit den jeweiligen koordinaten, sprich der text soll eben nicht in der linken oberen ecke stehen. Zellenhintergrund scheidet dabei aus, weil eben auch mehr als 2 komponenten darstellbar sein sollen.
Das eigentliche problem ist also das css positioning, welches sich nicht auf td bezieht, sondern auf body.
-