CSS Menü wird falsch dargestellt

[Gertbert]

Hallo,

ich habe ein Problem mit einem CSS Menü. Nämlich soll sich beim Drüberfahren mit der Maus die Farbe ändern. Das klappt soweit auch alles ganz gut.
Allerdings habe ich ein kleines Darstellungsproblem im Internet Explorer/Firefox.
Denn dort wird wie schon öfters der CSS anders dargstellt.

Hier mal der Code:

<style>
a.navi:active, a.navi:visited, a.navi:link {
display:block;
width:200px;
color: #727A85;
text-decoration: none;
margin-top:10px;
padding-left:10px;
background:#BFBFBF;
padding-top:15px;
height:50px;
padding-bottom:0px;
}

a.navi:hover {
color: #4B5460;
padding-left:12px;
}
</style>

<a href="1.php" class="navi"> Link 1</a>
<a href="2.php" class="navi"> Link 2</a>
<a href="3.php" class="navi"> Link 3</a>
<a href="4.php" class="navi"> Link 4</a>

Da ich den Text vertikal in der Mitte haben will, füge ich ein "padding-top:15px;" ein.
Der Firefox rechnet diese Größe jedoch zu den 50px der Höhe dazu.
Doch der IE macht das nicht. Bei ihm sind es immer noch die 50px, so wie es eigentlich auch sein soll.

Beim Drüberfahren mit der Maus ist dieser Effekt besonders gut zu sehen. Denn im FF anders als im IE wird das Feld um 2 Pixel breiter.


Weiß jemand, wie ich dieses Problem lösen kann?
Ich wäre sehr dankbar dafür

 

[Commodore]

Nur zur Info: der FF machts richitg, IE falsch: CSS 4 You - The Finest in Stylesheets: Workshop: Boxmodell

Das hier sollte dir helfen: Browserweiche für Internet Explorer mit Conditional Comments: Tipps und Tricks auf CSS 4 You - The Finest in Stylesheets

 

[Gertbert]

danke. jetzt weiß ich, dass der ie mal wieder nicht mitspielt.
das mit der browserweiche wusste ich schon davor, nur dachte ich, dass eine "elegantere" möglichkeit gibt, den fehler zu beheben.
aber danke für die links.