Div style absolute mit Angabe von top, left, right und bottom

[Cello]

Hallo,
Meine Grundproblematik ist folgende:

Ich bin gerade an einer Website mit einem etwas ungewöhnlicherem Design; aber eigentlich sollte man meinen das dürfte kein Problem darstellen...

Ich möchte ein Div folgendermaßen Positionieren:
-Abstand zum linken Bildschirmrand 335 Pixel
-Abstand zum rechten, oberen und unteren Rand jeweils 35 Pixel

In dem Div sind einige weitere Divs reinverschachtelt mit Texten und teilweise halbtransparenten Grafiken. Das ganze soll dann bei größeren Bildschirmen mitskalieren.

Wär ja eigentlich kein Problem sollte man meinen - in Firefox funktioniert folgender Code auch prächtig:

  
<div style="position:absolute; top:35px; left:335px; right:35px; bottom:35px;">  
 [... mehrere weitere divs mit Bildern und Texten ...]  
</div>  

Im Internet Explorer 8 hingegen hat das umgebende div eine Höhe und Breite von 0. Inhalte werden angezeigt, jedoch eben komplett deplatziert da auch diese sich nach den Abmessungen ihres Containers richten. Offensichtlich berechnet der Internet Explorer nicht automatisch die Breite die das Div aufgrund der Randabstände haben muss.

Da muss es doch eine einfache Lösung für dieses nun wirklich nicht allzu komplizierte Problem geben? Javascript sollte es nicht sein.

Grüße und danke schonmal.

[ChrisB]

Hi,

Offensichtlich berechnet der Internet Explorer nicht automatisch die Breite die das Div aufgrund der Randabstände haben muss.

Dann befindest du dich wahrscheinlich im Quirks Mode.

MfG ChrisB

[Cello]

Tatsache, auf die einfachsten Sachen kommt man nicht... Danke dir!

Noch eine Frage: Ich bette ohne weiteres Zutun folgendermaßen ein Bild in ein div ein:

  
  
<div style="position:absolute; top:0px; left:0px; right:0px; height:3px;">  
 <img src="rahmen.png" width="100%" height="100%">  
</div>  
  

Das ganze stellt dann die Oberkante eines drei Pixel dicken Rahmens dar. Das div ist einige hundert Pixel breit. Die Rahmengrafik ist jedoch in diesem Beispiel ca. 12 Pixel nach unten verschoben (und fängt also da an wo das div schon längst aufgehört hat).

Das Lustige ist: Die beiden Seitenteile des Rahmens, die 3 Pixel breit und einige hundert Pixel hoch sind, habe ich analog definiert. Die fangen jedoch genau in der linken oberen Ecke an. Wie kommt das?

Grüße

[Cheatah]

Hi,

Das ganze stellt dann die Oberkante eines drei Pixel dicken Rahmens dar.

eine Verzierung, also nichts, was ein <img>-Element rechtfertigen würde, geschweige denn ein zusätzliches <div>-Element. Entferne beides aus Deinem HTML-Code.

Wie kommt das?

Das liegt an der Bedeutung von <img>-Elementen, die nämlich genau wie Text einen *Inhalt* darstellen und somit ähnlich wie Text dargestellt werden. Du möchtest eine Verzierung vermitteln, dafür ist CSS da.

Cheatah