Bem pessoal, o ie6 deixa qualquer desenvolvedor web maluco. rs
Você faz todo o site, sempre testando nas versões mais novas dos navegadores e vai tudo bem. Até que num dado momento, você se lembra de que tem usuários navegando em versões antigas do internet explorer e decide testar… aí começa a dor de cabeça… aquele site que estava redondinho passa a ficar quadradinho… e você começa a ficar desesperado… o que eu faço agora?
É! isso aconteceu comigo.
Sobre o site:
O site que ocorreu o problema tem uma galeria de imagens que exibe os produtos de uma empresa, alinhados, divididos por linhas e colunas. Utilizo as tags <ul> <li> e a tag <a> para quando clicar exibir a imagem ampliada.
Código CSS com erro:
/* css para o div que mostrará as imagens */ #divTabela{height:200px;width:720px;padding:0;margin-top:5px} /* css para o bloco */ #divTabela ul{ display:inline; float:left; list-style:none; text-align:center; margin:0px; padding:0px; } /* css para cada imagem */ #divTabela li{ margin:8px 12px 0px 8px; padding:0px; width:100%; } /* css para colocar borda na imagem */ .img {padding:0px;margin:0px;border:2px solid #FFFFFF}
Utilizando o código css acima, as imagens eram exibidas na versão 6 do ie com um espaçamento a esquerda entre elas. Após várias buscas na internet achei uma solução que resolveu o meu problema e que poderá servir de referência para aqueles que tiverem o mesmo problema.
Resolvendo o problema:
Acrescente as linhas abaixo ao código css:
#divTabela ul{ display:block; }
Até a próxima!
Related posts:
