css problem mit firefox

[SaschaJ]

Hallo forum,

ich versuche eine reine css-seite für meine Schule zu erstellen unter dem IE funktioniert auch alles soweit nur der Firefox kommt mit meinen Einstellungen für das Menü nicht zurecht. Ich möchte dass das Menü die Seite in der Breite komplett ausfüllt nur wird vom Firefox das Menü mit ca. 110% breite dargestellt. Ich hoffe ihr könnt mir weiterhelfen ...

#header {
WIDTH: 100%;
}
#header .logo{
left: 0px;
top: 0px;
position: absolute;
}

#navcontainer {
left: 0px;
top: 0px;
position: absolute;
width: 100%;
padding: 0 0 0 170px;
margin: 53px 0 0 0;
BACKGROUND-COLOR: #1F2D7D;
}

#navcontainer A {
float:left;
PADDING: 4px 15px 4px 15px;
FONT: bold 80% arial, helvetica, sans-serif;
COLOR: #FFF;
BACKGROUND-COLOR: #1F2D7D;
TEXT-DECORATION: none;
}

#navcontainer A:hover {
COLOR: #000;
BACKGROUND-COLOR: #BCC5F5;
}

<div id="navcontainer">
<a href="" id="current">Aktuelles</a>
</div>
<div id="Header">
<img class="logo" src="# border="0" alt="Victor Klemperer" />
</div>

[jahlives]

Hast du deine Seite mal validiert ??
w3c.org
Ziemlich viel wird hier mokiert.

[wahsaga]

100% breite plus padding-left ...

informiere dich über das box model, und welche bugs der IE bei diesbezüglichen berechnungen hat.

[SaschaJ]

hab vielen dank ...
ich versuche das nun zu umgehen in dem ich ein div-element (banner) definiere welches hinter dem menü div liegt nur wird das vom firefox ignoriert ... und im ie wird dafür das logo verdeckt obwohl es doch durch den z-index über dem balken liegen müsste

Könnt ihr mir da weiterhelfen?


.logo{
z-index: 1;
left: 0px;
top: 0px;
position: absolute;
width: 160px;
height: 78px;
}
.banner {
z-index: -1;
position : absolute; top: 53px; left: 0px; width: 100%; height: 25px;
background: url(/_home/bilder/header-bg.gif) 0 0 repeat-x;
border: none 0;
}
#navcontainer {
z-index: 2;
left: 160px;
top: 53px;
position: absolute;
padding: 0 0 0 10px;
BACKGROUND-COLOR: #1F2D7D;
}

#navcontainer A {
float:left;
PADDING: 4px 15px 4px 15px;
FONT: bold 80% arial, helvetica, sans-serif;
COLOR: #FFF;
BACKGROUND-COLOR: #1F2D7D;
TEXT-DECORATION: none;
}

#navcontainer A:hover {
COLOR: #000;
BACKGROUND-COLOR: #BCC5F5;
}

[wahsaga]

als erstes solltest du dir mal abgewöhnen, ohne not exzessiv absolute positionierung zu benutzen ...

[SaschaJ]

Vielen dank wahsaga!

Ich hab jetzt alle absoluten positionierungen rausgeschmissen und durch float ersetzt scheint (bis jetzt) sogar alles zu klappen