Problema con menu vertical

[Kati]

Hola,
hice un menu vertical usando UL y LI hasta en 3 niveles de profundidad. El problema es que los altos de algunos items -a pesar de que son iguales- no se muestran bien en IE pero si en Forefox.

¿alguien que me de una mano?

Va el CSS

Código:

#menuv {
	list-style-type: none;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 0.75em;
	display: block;
	background-image: url(images/dotazul.gif);
	background-repeat: repeat-x;
	background-position: left bottom;
	width: 12em;
	margin: 0px;
	height: 100%;
}
#menuv a {
	font-family: "Trebuchet MS", Arial, sans-serif;
	color: #003399;
	text-decoration: none;
	text-align: left;
	display: block;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
#menuv a:hover {
	margin: 0px;
	padding: 0px;
}
#menuv ul {
	text-decoration: none;
	text-align: left;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
#menuv li {
	color: #FF6600;
	text-decoration: none;
	background-image: url(images/dotazul.gif);
	background-repeat: repeat-x;
	background-position: left top;
	font-weight: bold;
	margin: 0px;
}
#menuv li li {
}
#menuv li li a {
	font-weight: normal;
	color: #003399;
}
#menuv li li a:hover {
}
#menuv li li li {
	font-weight: normal;
	color: #FF6600;
	list-style-type: none;
	padding-bottom: 3px;
}

#menuv li li li a {
	font-weight: normal;
	color: #FF6600;
	list-style-type: none;
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 6px;
}
#menuv li li li a:hover {
	font-weight: normal;
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 6px;
}

#menuwork {
	list-style-type: none;
	font-family: "Trebuchet MS", Arial, sans-serif;
	font-size: 0.75em;
	background-image: url(images/dotazul.gif);
	background-repeat: repeat-x;
	background-position: left bottom;
	width: 12em;
	display: block;
	height: 100%;
	margin: 0px;
	padding: 0px;
}

#menuwork a {
	list-style-type: none;
	font-family: "Trebuchet MS", Arial, sans-serif;
	background-image: url(images/dotazul.gif);
	background-repeat: repeat-x;
	background-position: left top;
	display: block;
	margin: 0px;
}

#menuwork li a {
	background-image: url(images/vinwork.gif);
	background-repeat: no-repeat;
	background-position: left center;
	color: #FF6600;
	text-decoration: none;
	text-align: left;
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 22px;
}
#menuwork li a:hover {
	background-image: url(images/vinworkon.gif);
	background-repeat: no-repeat;
	background-position: left center;
	color: #FF6600;
	text-decoration: underline;
	padding-left: 22px;
}
#menuemail {
	list-style-type: none;
	font-family: "Trebuchet MS", Arial, sans-serif;
	font-size: 0.75em;
	background-image: url(images/dotazul.gif);
	background-repeat: repeat-x;
	background-position: left bottom;
	width: 12em;
	display: block;
}
#menuemail li a {
	font-weight: normal;
	color: #FF6600;
	list-style-type: none;
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 22px;
	text-decoration: none;
	background-image: url(images/vinemail.gif);
	background-repeat: no-repeat;
	background-position: left top;
	list-style-image: none;
}
#menuemail li a:hover {
	font-weight: normal;
	color: #FF6600;
	list-style-type: none;
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 22px;
	text-decoration: underline;
	background-image: url(images/vinemailon.gif);
	background-repeat: no-repeat;
	background-position: left center;
	list-style-image: none;
}
#menuemail a {
	font-weight: normal;
	color: #FF6600;
	list-style-type: none;
	text-decoration: none;
	background-image: url(images/vinemail.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
}

Aquí el código

Código HTML:

<div id="menuv"> 
	<ul>
    	<li><a href="#">Menu A</a></li>
	    <li><a href="#"> Menu B</a>
		<ul>
			<li><a href="#">Submenu A</a></li>
		    <li><a href="#">Submenu B</a>
		    	<ul>
				<li><a href="#">subsub1</a></li>
				<li><a href="#">subsub2</a></li>
				</ul></li>
		</ul></li>
		<li><a href="#">Menu C</a></li>
	
</ul>
</div>
<div id="menuwork">
  <li><a href="#">Trabajo</a></li>
</div>
<div id="menuemail">
  <li><a href="#">Contacto</a></li>
</div> 

gracias de antemano
Kati

[chem]

Buenas Kati! Lo llevavas muy bien hasta llegar a trabajo y contacto... Un <li> nunca puede ir sin sú <ul>. No se muy bien como querras englobar exactamente a trabajo y a contacto pero un código valido sería este:

Código:

<div id="menuv"> 
	<ul>
    	     <li><a href="#">ELEMENTO 1</a></li>
	     <li><a href="#"> ELEMENTO 2</a>
	     <ul>
		   <li><a href="#">ELEMENTO 2.1</a></li>
		    <li><a href="#">ELEMENTO 2.2</a>
		    <ul>
			<li><a href="#">ELEMENTO 2.2.1</a></li>
			<li><a href="#">sELEMENTO 2.2.2</a></li>
		    </ul>
                    </li>
	     </ul>
             </li>
	     <li><a href="#">ELEMENTO 3</a>
             <ul>
		<li><a href="#">TRABAJO</a></li>
		<li><a href="#">CONTACTO</a></li>
	    </ul>	
            </li>
      </ul>
</div>

No se si se me habrá colado alguna etiqueta pero vamos tú código debería aproximarse a eso y a partir de ahí retoca tu CSS y todo empezará a funcionar mejor.

Un saludo!