line-height wird fehlerhaft dargestellt

[insanityivy]

Also ich habe jetz eine index.html und dort drin eine Liste.

<div id="box">
  <ul id="navigation">
    <li><a href="landscapes.html">landscapes</a></li>
    <li><a href="">stuff</a></li>
    <li><a href="">textures</a></li>
    <li><a href="">contact</a></li>
  </ul>
</div>

Jetz habe ich versucht über eine externe Datei die Linienhöhe zu verändern, mit line-height.

ul#navigation {
list-style-type:none;
margin:15px 0px; padding:0px; margin-right:100px;
line-height:23px;
}

ul#navigation li a {
text-decoration:none;
color:#00ff5a;
font-family:Verdana, Arial, Helvetica, sans-serif; font-weight:500; font-size:36px;
letter-spacing:0.004em; text-transform:uppercase;
}

ul#navigation li a:hover {
color:#00ffe4;
}

Also in meinem Firefox wird die line-height richtig interpretiert. Aber im Internet Explorer wird alles irgendwie "gestaucht" dargestellt. Noch viel enger beisammen, sozusagen.