Menü mit UL und images: horizontaler Abstand passt im IE nicht

[Jon]

Hallo,

ich wollte ein kleines Menü mit CSS realisieren. Sieht etwa so aus:

<ul id="MenuList">
  <li>
    <a href="default.aspx?cid=1">
      <img src="images/menue/1.jpg" alt="Menu"/>
    </a>
  </li>
[...]
</ul>

Und von diesen Li-Elementen noch andere 15 mehr. Das CSS dazu sieht folgend aus:

ul#MenuList
{
 float:left;
 padding-left:300px;
 padding-top:49px;
 padding-right:0;
 padding-bottom:0;
 margin:0 0 0 0;
 list-style:none;
}

ul#MenuList li
{
 padding:0px 0px 0px 0px;
 margin:0px 0px 0px 0px;
 border:none;
}

ul#MenuList a
{
 padding:0px 0px 0px 0px;
 margin:0px 0px 0px 0px;
 border:none;
}

ul#MenuList img
{
 border:none;
 padding:0px 0px 0px 0px;
 margin:0px 0px 0px 0px;
}

Das Problem: im IE (und im Firefox, aber nicht im Opera) entsteht hier ein Abstand von einigen Pixeln unter jedem Menüpunkt. Es sollte aber überhaupt kein Abstand dazwischen sein.

Für Firefox bringt es Abhilfe, wenn ich im CSS für img noch:

display:block;

hinzufüge. Im Opera passt es dann weiterhin. Im IE jedoch entsteht dann ein Abstand von 50 Pixeln zwischen den Elementen :-O ...

Das sieht natürlich katastrophal aus.

Was mache ich hier falsch? Bzw. handelt es sich um einen IE-Bug? Und wenn ja, welchen?

Danke & lg
Jon