problemas con un menu

[hades87]

tengoe ste menu:

Código:

ul#menu{
    list-style:none;
    margin:0;
    padding:0;
}

ul#menu li a{
    margin-right: 1px;
    float:left;
}

ul#menu li a#origencat{
display:block;
width:85px;
height:40px;
background:url(cat/imagenes/1origen.jpg) center no-repeat #FD0100;
}

ul#menu li a#origencatact{
display:block;
width:85px;
height:40px;
background:url(cat/imagenes/11origen.jpg) center no-repeat #FFA200;
}

ul#menu li a#origencat:hover{
background:url(cat/imagenes/11origen.jpg) center no-repeat #FFA200;
}

ul#menu li a#prodcat{
display:block;
width:110px;
height:40px;
background:url(cat/imagenes/2produccio.jpg) center no-repeat #FD0100;
}

ul#menu li a#prodcatact{
display:block;
width:110px;
height:40px;
background:url(cat/imagenes/21produccio.jpg) center no-repeat #FFA200;
}

ul#menu li a#prodcat:hover {
background:url(cat/imagenes/21produccio.jpg) center no-repeat #FFA200;
}

ul#menu li a#producat{
display:block;
width:105px;
height:40px;
background:url(cat/imagenes/3productes.jpg) center no-repeat #FD0100;
}

ul#menu li a#producatact{
display:block;
width:105px;
height:40px;
background:url(cat/imagenes/31productes.jpg) center no-repeat #FFA200;
}

ul#menu li a#producat:hover{
background:url(cat/imagenes/31productes.jpg) center no-repeat #FFA200;
}

ul#menu li a#localizcat{
display:block;
width:125px;
height:40px;
background:url(cat/imagenes/4localitzacio.jpg) center no-repeat #FD0100;
}

ul#menu li a#localizcatact{
display:block;
width:125px;
height:40px;
background:url(cat/imagenes/41localitzacio.jpg) center no-repeat #FFA200;
}

ul#menu li a#localizcat:hover{
background:url(cat/imagenes/41localitzacio.jpg) center no-repeat #FFA200;
}

ul#menu li a#contcat{
display:block;
width:102px;
height:40px;
background:url(cat/imagenes/5contacte.jpg) center no-repeat #FD0100;
}

ul#menu li a#contcatact{
display:block;
width:102px;
height:40px;
background:url(cat/imagenes/51contacte.jpg) center no-repeat #FFA200;
}

ul#menu li a#contcat:hover{
background:url(cat/imagenes/51contacte.jpg) center no-repeat #FFA200;
}

y este es el codigo html:

Código HTML:

<ul id="menu">
<li><a href="../cat/origen.html" id="origencat" title="Origen"></a> </li>
<li><a href="../cat/produccion.html" id="prodcat" title="Producci&oacute;"></a></li>
<li><a href="#" id="producatact" title="Productes"></a></li>
<li><a href="../cat/localizacion.html" id="localizcat" title="Localitzaci&oacute;"></a></li>
<li><a href="../cat/contacte.html" id="contcat" title="Contacte"></a></li>
</ul> 

el tema es que en firefox todo se ve bien, pero como era de esperar en Internet explorer se me ve mal, el menú aparece como 1 escalera, os ea cada elemento del li sale un poco mas abajo que el anterior.

y aquí un ejemplo:



Gracias por todo y hasta pronto