Menu drop down

[trambulhao 0]

Boas.. seguinte pessoal, não consigo acertar o menu abaixo no IE, nos demais Browsers funcionam bem.

 

CSS:

ul#navCatEsq {   padding:0;  margin:0;  list-style:none;  border-top:1px #7CA7D1 solid; }ul#navCatEsq li {  position:relative;  list-style:none;  display:block;/*  width:100%;  Para mostrar as linhas no IE */  border-bottom:1px #7CA7D1 solid; }ul#navCatEsq li a {  display:block;  list-style:none;/*  width:100%;  Para o campo todo ser clicavel -> IE */  text-decoration:none;  color:#2D6AA4;  font-family:Tahoma, Arial, Verdana, sans-serif;  font-size:10pt;  border-left:6px #2D6AA4 solid;  padding:5px 0px 5px 10px;   line-height:100%; }ul#navCatEsq li a:hover {  display:block;  padding:5px 0px 5px 10px;   color:#2D6AA4;  border-left:6px #FF8000 solid;  background: #FFF url('../imagens/setaMenuHover.gif') no-repeat scroll 98%; }ul#navCatEsq li ul { /* Sub-menu */  position:absolute;  border-top:1px #7CA7D1 solid;  top:0;  left:100%;  width:100%;  margin:0;  padding:0;  display:none; }ul#navCatEsq li ul li {  width:100%;  background-color:#F2F2F2;  border-right:1px #7CA7D1 solid; }ul#navCatEsq li:hover ul, ul#navCatEsq li.over ul { display:block; }

Menu:

<ul id="navCatEsq"><li><a href="5">Caixas</a></li><li><a href="18">Cartões Memória</a></li><li><a href="1">Computadores</a></li><li><a href="2">Cubos Barebones</a></li><li><a href="6">Discos Rígidos</a></li><li><a href="19">Disp. de Jogos</a></li><li><a href="java script:void(0);">Disp. Sonoro</a> <ul>  <li><a href="13">Colunas</a></li>  <li><a href="14">Microfones e Auscultadores</a></li>  <li><a href="15">Telefones p/ VoIP</a></li> </ul></li><li><a href="8">Drives Disquetes</a></li><li><a href="20">Fax</a></li><li><a href="9">Gravadores</a></li><li><a href="java script:void(0);">Impressoras</a> <ul>  <li><a href="3">Fotográficas</a></li>  <li><a href="1">Jacto de tinta</a></li>  <li><a href="2">Laser</a></li>  <li><a href="4">Matriciais</a></li>  <li><a href="5">Transferência térmica</a></li> </ul></li><li><a href="22">Internet</a></li><li><a href="10">Leitores</a></li><li><a href="23">Maq. Fotográfica</a></li><li><a href="11">Memórias</a></li><li><a href="java script:void(0);">Monitores</a> <ul>  <li><a href="6">CRT</a></li>  <li><a href="7">TFT</a></li> </ul></li><li><a href="13">Motherboard</a></li><li><a href="java script:void(0);">Ocasião</a> <ul>  <li><a href="21">Gráficas</a></li> </ul></li><li><a href="31">Pda</a></li><li><a href="24">Pen Drive</a></li><li><a href="29">Videoprojector</a></li><li><a href="30">Web Cam</a></li></ul>

Nos bons browsers trabalha certinho. Porém, no IE, o erros são os seguintes:

- Os campos não ficam clicavel, somente em cima do nome. já os que tem-em submenu, não acontece o mesmo.

- Se eu retirar os comentários das linhas onde tem a largura "width:100%;", resolve o problema acima, mas nos outros browser fica mau.

- Aparece também um espaços entre os campos da lista utilizando o width.

 

Ando a 2 dias a volta desse menu, e não consigo fazer com que ele seja compatível com o IE.

 

Agradeço desde já quem poder ajudar.

[trambulhao 0]

Resolvido.... pode trancar!!! :)