div: "position:absolute"-Urspung in einem Tabellenfeld?

[Anton Katzer]

Hallo.

Ich möchte mit 'layer'-DIVs auf meiner Site arbeiten. Also einzelne Elemente, die ich exakt positioniere. Dazu kommt aber, dass die Site im Wesentlichen zentriert sein soll, damit sie bei Auflösungen jenseits von 1024x768 nicht am linken Rand klebt.

Ich habe also eine 9-Feld-Tabelle, in das mittlere Feld (feste Größe) die Seite 'aufnehmen' soll, die angrenzenden Felder nutze ich für (wichtige) sich wiederholende Hintergrundgrafiken (1px breit, keine Angst;)).

Nun hätte ich gern eine Möglichkeit, die DIVs (oder zumindest eines, die anderen können ja 'nested' werden) ebenfalls mittig zu plazieren, genauer gesagt hätte ich den Ursprung für die Positionierung gern in der linken oberen Ecke des zentralen Tabellenfeldes.

Geht das irgendwie? Die DIVs innerhalb der <td> zu plazieren ist gar keine Lösung, wie ich leider feststellen durfte.

[Jeena Paradies]

Hallo,

Du musst das Elternelement deines divs relativ positionieren also:

td { position: relative; }

Grüße
Jeena Paradies

[A. Katzer]

Du musst das Elternelement deines divs relativ positionieren also:

td { position: relative; }

Danke. Funktioniert beim IE einwandrei, Opera und Firefox meckern jedoch, die Felder werden jedenfalls falsch plaziert. Es geht doch darum, das entsprechende Tabellenfeld so abzuändern, oder?:

<td style="position: relative;">
<div style="position: absolute; left:10px [..]></div>
</td>

Oder hab ich was falsch verstanden?

[Jeena Paradies]

Hallo,

Danke. Funktioniert beim IE einwandrei, Opera und Firefox meckern jedoch, die Felder werden jedenfalls falsch plaziert. Es geht doch darum, das entsprechende Tabellenfeld so abzuändern, oder?:

Also wenn der IE das anders positioniert als Opera und Firefox dann liegt es wohl daran dass er es falsch interpretiert, und die anderen zwei es richtig machen. Ich nehme mal stark an dass es mit dem Box Model Bug zu tun hat, wie du das umgehen kannst steht ausführlich erklärt hier: http://tantek.com/CSS/Examples/boxmodelhack.html

<td style="position: relative;">
<div style="position: absolute; left:10px [..]></div>
</td>

So sollte es funktionieren.

Grüße
Jeena Paradies