Problema con margenes de IE y Firefox!!!

[santiagolee]

Hola he hecho este menu desplegable y tengo problemas al visualizarlo en los navegadores Internet Explorer 7 y mozilla Firefox

aqui les pongo el codigo

HTML

<div id="menucont">
<ul class="menu">
<li><a href="#">Inicio</a></li>
<li><a href="#">Quienes Somos</a></li>
<li>Productos
<ul>
<li><a href="#">Inicio</a></li>
<li><a href="#">Quienes Somos</a></li>
</ul>
</li>
</ul>
</div>

CSS

#menucont{
width:100%;
background:url(imagenes/back_menu.gif) top repeat-x;
float:left;
height:26px;
clear:both;
margin: 0px;
padding-left:13px;
}
#menucont a {
color:#000000;
margin:0px;
padding:0px;
}
#menucont a:hover {color:#006600;}
ul.menu {
height:26px;
padding:0px;
font-weight: bolder;
color: #000000;
list-style:none;
margin:0px;
float:left;
}
ul.menu li{
font-size:10px;
display:inline;
line-height:26px;
padding:7px;
position:relative;
background: #009900;
}
ul.menu li:hover{
color: #006600;
}
ul.menu ul {
display:none;
list-style:none;
position:absolute;
left:0px;
top: 26px;
background: #E4E4E4;
padding:0px;
width: 150px;
color: #000000;
opacity:0.8;
margin: 0px;
z-index:+199;
}
ul.menu ul li{
display:block;
padding:5px 0px 0px 7px;
margin-top:0px;
position:relative;
}
ul.menu ul li:hover{
display:block;
background: #C1C1C1;
color: #006600;
margin:0px;
}
ul.menu li:hover > ul
{
display:block;
}

El problema es que en IE los elementos ul.menu ul li muestran un margen que los separa, cosa que no sucede en Firefox.
Ademas Firefox Muestra los elementos ul.menu li con una separacion similar a la que muestran los elementos ul.menu ul li en Internet Explorer