Netscape Bug bei position: absolute; bottom: 0px;

[Christoph]

Hi,

Wie der Titel schon sagt, hab ich ein Problem mit der bottom-Eigenschaft. Hier erstmal meine Struktur:

HTML:

<div id="wrapper">
 <div id="body">
  <div id="header">
   <div id="mainmenue">
    Hier mein Inhalt
   </div>
  </div>
 </div>
</div>

CSS:

/** Layout **/
body {margin: 0px; padding: 0px;}
#wrapper {float: left; width: 100%; position: relative;}
#body {width: 979px; position: relative;}
#header {float: left; width: 100%; height: 204px; position: relative;  }
#mainmenue {position: absolute; bottom: 0px; right: 0px;  height: 51px;  }

Funktioniert perfekt im IE und im Firefox, doch der Netscape 7 zeigt das #mainmenue NICHT am unteren Rand des #header an, wie vorgesehen, sondern versteht das bottom: 0px; nicht richtig. Er zeigt das #mainmenue nämlich ganz oben an(außerhalb des Bildschirmrandes). Erst mit bottom: -50px; kommt das menü soweit runter, dass es sichtbar ist.

Ist das generell ein Netscape-Bug, die bottom-Eigenschaft nicht zu kennen, oder ist da irgendwas falsch? Danke schonmal für eure Antworten!

MfG
Christoph

[Detlef G.]

Hallo Christoph

... oder ist da irgendwas falsch?

Falsch direkt nicht, ich frage mich allerdings, wozu diese tiefe Div-Verschachtelung und Positionierung dienen soll.

Auf Wiederlesen
Detlef

[Gernot Back]

Hallo Christoph,

/** Layout **/
body {margin: 0px; padding: 0px;}
#wrapper {float: left; width: 100%; position: relative;}
#body {width: 979px; position: relative;}
#header {float: left; width: 100%; height: 204px; position: relative;  }
#mainmenue {position: absolute; bottom: 0px; right: 0px;  height: 51px;  }

Ist das generell ein Netscape-Bug, die bottom-Eigenschaft nicht zu kennen, oder ist da irgendwas falsch? Danke schonmal für eure Antworten!

Nein, es ist generell ein Netscape-Bug, dass er es nicht mag, dass ein Element gleichzeitig floatet und relativ positioniert ist: Du brauchst, wenn ich das richtig sehe, die relative Positionierung des Elements mit der ID "header", um daran seinerseits das Element mit der ID "mainmenue" absolut zu positionieren. Bei den übrigen Elementen brauchst du nach meinem Dafürhalten gar keine Positionierung, denn du lässt dich da ja noch nicht einmal zu den Breiten und Höhen, geschweige denn zu den Top-, Right-, Bottom- und Left-Werten aus.

Schachtele einfach ein weiteres Element in deinen nur floatenden, aber nicht positionierten "header", dem du dann nur position:relative aber kein float verpasst und alles wird auch in Netscape 7 gut.

Gruß Gernot

[Christoph]

Nein, es ist generell ein Netscape-Bug, dass er es nicht mag, dass ein Element gleichzeitig floatet und relativ positioniert ist: Du brauchst, wenn ich das richtig sehe, die relative Positionierung des Elements mit der ID "header", um daran seinerseits das Element mit der ID "mainmenue" absolut zu positionieren. Bei den übrigen Elementen brauchst du nach meinem Dafürhalten gar keine Positionierung, denn du lässt dich da ja noch nicht einmal zu den Breiten und Höhen, geschweige denn zu den Top-, Right-, Bottom- und Left-Werten aus.

Schachtele einfach ein weiteres Element in deinen nur floatenden, aber nicht positionierten "header", dem du dann nur position:relative aber kein float verpasst und alles wird auch in Netscape 7 gut.

Gruß Gernot

Hi Gernot

Wow, hat perfekt funktioniert. Danke für den Tip!

lg
Christoph