Infelizmente ainda tem muita gente usando Internet Explorer 6 por aí.
Nos grandes portais brasileiros, segundo as últimas pesquisas, esse número chega a perturbantes 40% dos usuários. Ou seja, o seu site precisa ser exibido corretamente no IE6. E seria fácil se o IE7 renderizasse o htm da mesma maneira, assim você faria seu código para o Firefox e precisaria de apenas um hack: que funcionasse no IE6 e IE7.
O famoso underline (’_') antes dos seletores (’_width:’) resolveria. Mas isso não acontece, pois essa última versão do IE corrigiu algumas falhas na interpretação dos padrões, não aceita o hack do underline e renderiza os estilos de maneira diferente da versão anterior.
Ou seja, muitas vezes o seu layout aparece de 3 maneiras diferentes dependendo do browser onde está sendo exibido: no Firefox [e outros browsers Standards compliants], no IE7 ou no IE6.
Como isso acontece com frequência (eu já tive esse problema em vários sites) segue uma maneira simples de resolver:
Hacks específicos para cada navegador
.
Acima vocês podem ver a mesma página sendo exibida de forma diferente em cada um dos três navegadores (em cada um deles o box aparece de uma cor diferente). Isso acontece porque estou usando o seguinte código:
#box {
width:100px;
height:100px;
border:2px solid #ddd;
background-color:red; /* Todos os navegadores interpretam essa linha: Firefox, IE7 e IE6 */
*background-color:blue; /* Apenas IE7 e IE6 */
_background-color:green; /* Apenas IE6 */
}
As quatro primeiras linhas são interpretadas por todos os navegadores.
A 5ª linha, com o asterisco (’*') na frente do seletor, é interpretada apenas pelo IE7 e IE6, então o Firefox mantém o background vermelho.
E a 6ª linha, com o “_” na frente, é reconhecida apenas pelo IE6, então o IE7 mantém o bg blue.
Isso já resolveu muitos problemas beeem chatos.
Veja também : CSS: Problemas comuns com internet explorer 6 e como resolvê-los
11 Comentários
Muito bom!
[...] Se tiver dúvida dê uma olhada aqui: CSS Hacks – IE6, IE7, Firefox [...]
Esta é minha div com suas configurações.
#menu_portifolio{
height: auto;
width: 128px;
*width: 128px;
_width: 128px;
*padding-left: 120px;
_padding-left: 120px;
margin-top: 70px;
background-image: url(images/bg_menu_portifolio.gif);
background-repeat: repeat;
}
Não sei por qual motivo o IE 7 está lendo a configuração do underline que seria so para IE 6.
Me ajude por favor.
se tiver resposta para essa solução favor me enviar um email.
[...] São vários os sites que relatam os infinitos hacks para o Internet Explorer 6, que são o terror na vida de qualquer programador web.Se não sabe do que estou falando, visite algumas destas páginas abaixo, e vai ficar surpreso.Hacks CSS para IE6 e IE7Mais Hacks para o IE e Firefox [...]
Alternativa interessante, porém não passa na validação.
O que adianta passar na validação de “descaralha” no monitor ?…rs
.
A validação é uma idealização, um selo no site não deve substituir o bom senso e ser mais importantes do que a verdadeira usabilidade.
Eu estava precisando desta informação. Muito obrigado.
vlw ae cara muito obrigado
Valeu amigo, vou testar no meu trabalho.
Simples, prático e objetivo!
Muito obrigada, estava precisando!
Não vejo porque o pessoal tem resistência em criar comentários condicionais para aplicar css em versões do ie6 e ie7. É mais simples, é válido segundo a w3c e não é tão oneroso assim.