molily: Problem mit CSS im IE: falsche darstellung

Beitrag lesen

Hallo Tobias,

Mein Problem im IE ist leider immer noch nicht gelöst...

Falsch ist, dass der IE den schwarzen Rahmen oberhalb der Navi-leiste weglässt...

Er interpretiert padding-top für #head nicht richtig, daran liegt es. Wenn du ein wenig am Wert herumspielst, ihn bspw. erhöhst, erscheint der Abstand. Vielleicht liegt's am relativen em-Wert.

Ich kann dir nur raten, das Konzept zu ändern, beispielsweise dass du das #head-div herausnimmst und nur das #navigation-div verbleiben lässt, welches dann auch ein p-Element sein könnte. Den schwarze »Rahmen«, welcher momentan lediglich die Hintergrundfarbe des #head-Elements ist, könntest du mit border lösen. Der blaue Hintergrund würde dann natürlich bis zum rechten Rand durchgehen...

Noch etwas anderes: Anstatt Klassen zu vergeben könntest du beispielsweise mit Nachkommensselektoren arbeiten.

<div id="navigation"> ... <a class="nav" href="/uebermich/">Über mich</a> ...</div>
a.nav:link {...}
a.nav:visited {...}
a.nav:hover {...}
a.nav:active {...}

Das ist umständlich, einfacher geht es so:

<div id="navigation"> ... <a href="uebermich/">Über mich</a> ...</div>
#navigation a:link {...}
#navigation a:visited {...}
usw.

Dasselbe gilt für die span-Elemente in der Navigation. Wenn sonst keine span-Element vorkommen und solche nur für die Trennzeichen verwendet werden, kannst du dir die Klassen ebenfalls sparen und einfach alle span-Elemente innerhalb des #navigation-Elements als solche behandelt:

<div id="navigation"> ... <span class="trennzeichen">||</span> .. </div>
.trennzeichen {...}

...wird zu...

<div id="navigation"> ... <span>||</span> ... </div>
#navigation span {...}

Wie oben gesagt würde ich im Falle des Falles ein p-Element einsetzen.

Grüße,
Mathias

--
believing atheist ;)