Problema no IE com menus <ul> <li> css

[Thyago Franco 0]

Estou com um problema no IE, olhem os codigos.

HTML

<font size="2" face="Arial"><span class="tabela_produtos"></span>			</font>			<ul id="nav"> 			  <li><font size="2" face="Arial"><a href="#">Adesivos</a> 				</font>				<ul>				  <li><font size="2" face="Arial"><a href="/menu/produtos/adere.html"target="principal">Adere</a></font></li>				  <li><font size="2" face="Arial"><a href="/menu/produtos/doblea.html"target="principal">Doble 					A</a></font></li>				</ul>			  <li><font size="2" face="Arial"><a href="#">Brocas/ Machos</a>				</font>				<ul>				  <li><font size="2" face="Arial"><a href="/menu/produtos/loyal.html"target="principal">Loyal</a></font></li>				</ul>			  <li><font size="2" face="Arial"><a href="#">Cabo de Aço</a> 				</font>				<ul>				  <li><font size="2" face="Arial"><a href="http://www.cimafbrasil.com.br"target="_blank">Cimaf</a></font></li>				</ul>			  <li><font size="2" face="Arial"><a href="#">Complementos</a> 				</font>				<ul>				  <li><font size="2" face="Arial"><a href="/menu/produtos/anjo.html"target="principal">Anjo</a></font></li>				</ul>			  <li><font size="2" face="Arial"><a href="#">Discos</a> 				</font>				<ul>				  <li><font size="2" face="Arial"><a href="/menu/produtos/klingspor.html"target="principal">Klingspor</a></font></li>				  <li><font size="2" face="Arial"><a href="/menu/produtos/kronos.html"target="principal">Kronos</a></font></li>				  <li><font size="2" face="Arial"><a href="/menu/produtos/norton.html"target="principal">Norton</a></font></li>				  <li><font size="2" face="Arial"><a href="/menu/produtos/Pferd.html"target="principal">Pferd</a></font></li>				  <li><font size="2" face="Arial"><a href="/menu/produtos/redescor.html"target="principal">Redescor</a></font></li>				  <li><font size="2" face="Arial"><a href="/menu/produtos/tyrolit.html"target="principal">Tyrolit</a></font></li>				</ul>			  <li><font size="2" face="Arial"><a href="#">Eletrodos/ Arames</a> 				</font>				<ul>				  <li><font size="2" face="Arial"><a href="/menu/Produtos/BELGO.html"target="principal">Belgo</a></font></li>				  <li><font size="2" face="Arial"><a href="/menu/Produtos/ESAB.html"target="principal">Esab</a></font></li>				  <li><font size="2" face="Arial"><a href="http://www.weldinox.com.br"target="_blank">Weldinox</a></font></li>				</ul>			  <li><font size="2" face="Arial"><a href="#">EPIs</a> 				</font>				<ul>				  <li><font size="2" face="Arial"><a href="/menu/produtos/bracol.html"target="principal">Bracol</a></font></li>				  <li><font size="2" face="Arial"><a href="/menu/produtos/carbografite.html"target="principal">Carbografite</a></font></li>				  <li><font size="2" face="Arial"><a href="http://www.danny.com.br"target="_blank">Danny</a></font></li>				  <li><font size="2" face="Arial"><a href="/menu/produtos/ksn.html"target="principal">KSN</a></font></li>				  <li><font size="2" face="Arial"><a href="/menu/produtos/pomp.html"target="principal">Pomp</a></font></li>				</ul>			  <li><font size="2" face="Arial"><a href="#">Fechaduras</a> 				</font>				<ul>				  <li><font size="2" face="Arial"><a href="/menu/produtos/stam.html"target="principal">Stam</a></font></li>				  <li><font size="2" face="Arial"><a href="http://www.ferragens3f.com.br"target="_blank">3F</a></font></li>				</ul>			  <li><font size="2" face="Arial"><a href="#">Ferramentas</a> 				</font>				<ul>				  <li><font size="2" face="Arial"><a href="/menu/produtos/submenu/ferramentas.html"target="principal">Loyal</a></font></li>				</ul>			  <li><font size="2" face="Arial"><a href="#">Lixas</a> 				</font>				<ul>				  <li><font size="2" face="Arial"><a href="/menu/produtos/submenu/lixas_dobrea.html"target="principal">Doble 					A</a></font></li>				  <li><font size="2" face="Arial"><a href="/menu/produtos/indasa.html"target="principal">Indasa</a></font></li>				  <li><font size="2" face="Arial"><a href="/menu/produtos/submenu/lixas_klingspor.html"target="principal">Klingspor</a></font></li>				  <li><font size="2" face="Arial"><a href="/menu/produtos/submenu/lixas_norton.html"target="principal">Norton</a></font></li>				</ul>			  </li>			  <li><font size="2" face="Arial"><a href="#">Pneumaticos</a> 				</font>				<ul>				  <li><font size="2" face="Arial"><a href="/menu/produtos/vimake.html"target="principal">Vimake</a></font></li>				</ul>			  <li><font size="2" face="Arial"><a href="#">Parafusos</a> 				</font>				<ul>				  <li><font size="2" face="Arial"><a href="http://www.hard.com.br"target="_blank">Hard</a></font></li>				  <li><font size="2" face="Arial"><a href="http://www.ciser.com.br"target="_blank">Ciser</a></font></li>				</ul>			  </li> 			  <li><font size="2" face="Arial"><a href="#">Soldas</a> 				</font>				<ul>				  <li><font size="2" face="Arial"><a href="/menu/Produtos/submenu/eletrodos_esab.html"target="principal">Esab</a></font></li>				  <li><font size="2" face="Arial"><a href="http://www.oximig.com.br"target="_blank">Oximig</a></font></li>				  <li><font size="2" face="Arial"><a href="/menu/Produtos/SUMIG.html"target="principal">Sumig</a></font></li>				</ul>			  </li>			  <li><font size="2" face="Arial"><a href="#">Polidores</a> 				</font>				<ul>				  <li><font size="2" face="Arial"><a href="/menu/Produtos/MEGUIARS.html"target="principal">Meguiars</a></font></li>				</ul>			  </li>			  <li><font size="2" face="Arial"><a href="#">Rebites</a> 				</font>				<ul>				  <li><font size="2" face="Arial"><a href="/menu/Produtos/REBITOP.html"target="principal">Rebitop</a></font></li>				</ul>			  </li>		  </ul>

CSS

body {	font: normal 15px arial;	margin:0px;	}ul {	margin: 0;	padding: 0;	list-style: none;	width: 130px; /* Width of Menu Items */	border-bottom: 1px solid #ccc;	}	ul li {	position: relative;	}	li ul {	position: absolute;	left: 130px; /* Set 1px less than menu width */	top: 0;	display: none;	}/* Styles for Menu Items */ul li a {	display: block;	text-decoration: none;	color: white;	background: red; /* IE6 Bug */	padding: 3px;	border: 1px solid #ccc; /* IE6 Bug */	border-bottom: 0;	}	/* Holly Hack. IE Requirement \*/* html ul li { float: left; height: 1%; }* html ul li a { height: 1%; }/* End */li:hover ul, li.over ul { display: block; } /* The magic */ ul li a:hover { color: black; background: #f1f1f1; text-align:center; text-decoration:underline;} /* Hover Styles 		li ul li a { padding: 2px 5px; } /* Sub Menu Styles */		li:hover ul, li.over ul { display: block; } /* The magic */

Isso executado no Firefox funciona certinho, os submenus aparecem normal e clicando neles eles abrem no <iframe> principal os links, mais no so de colocar o mouse em cima dos links o iframe fica muda para default, tipo ele abre o link dai você movimenta o mouse sobre os submenus e sobre o menu ele já sai do link que estava. é meio complicado explicar mais por favor executem no firefox e vejam, no IE da esse problema ridiculo

 

A, esse eh o java script para os submenus aparecerem porque no IE eles não funcionam sem esse .js

// JavaScript DocumentstartList = function() {if (document.all&&document.getElementById) {navRoot = document.getElementById("nav");for (i=0; i<navRoot.childNodes.length; i++) {node = navRoot.childNodes[i];if (node.nodeName=="LI") {node.onmouseover=function() {this.className+=" over";  }  node.onmouseout=function() {  this.className=this.className.replace(" over", "1");   }   }  } }}window.onload=startList;

Por favor me ajudem!!!

[Thyago Franco 0]

Desculpa galera esqueci de colocar a url:

http://www.abrassol.com.br