segunda-feira, 20 de fevereiro de 2012

Menu CSS não funciona no Explorer - IE

A coisa é simples. Há um monte de faqs de pessoas que perceberam que seus menus suspensos em CSS (os mais utilizados) não funcionam no Internet Explorer, seja IE 6, IE 7, IE 8 ou IE 9 (até o momento) mas funcionam no Chrome e Firefox. Não há uma resposta correta e a turma fica imaginando que o erro está na codificação do CSS, quando não está.

Ficam quebrando a cabeça e não chegam a solução alguma. Ou pior, algum "expert" diz que "o menu abriu certinho no meu computador, deve ser o seu que está com problema..." Dentro da simplificação da burrice humana, esta é uma resposta muito habitual.

Pesquisei, mais ou menos uns 10 minutos e vi que muitos americanos, inclusive nas faqs sobre CSS da própria Microsoft falavam em "renderização" da página da web de forma diferente nos Explorers 7 em diante. O que é isso? Não interessa para você, nem para ninguém.

Ocorre que para os menus CSS, e outros (flash, activeX etc) serem mostrados corretamente nos Explorers e apenas neles, é preciso que o USUÁRIO, marque uma opção na configuração do Explorer. Aqueles tais "experts" que não encontram o erro, tem essa opção marcada. Mas não podemos IMAGINAR que o usuário vai marcar, ou vai saber marcar, ou vai acreditar em nós e marcar a nosso pedido. Tinha que haver outra forma e há.

Verifique a PRIMEIRA LINHA do código de sua página com problemas. Se sua codificação é recente (últimos 3 ou 4 anos) é provável que ela esteja assim, ou semelhante a isso. O que significa? Não importa.

!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

É nessa tal especificação do DocType (tipo do documento) que está toda a confusão feita pela Microsoft. É preciso incluir um parâmetro que leva à definições do consórcio W3.org e diz que a página deverá ser renderizada (esquece isso, só use...) na qualidade mais alta, sempre. É essa qualidade que o Explorer exige. Diferença visual? NENHUMA, exceto que os menus CSS vão funcionar!!! 

Então basta trocar a primeira linha para:

!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"

Vai fundo. Copie e cole! Acabei de fazer isso e resolvi o problema que não conseguia resolver. No fim das contas, todos os CSS que programei estavam absolutamente corretos. A Micosoft é que estava absolutamente errada e cada vez mais trilhardária nos empurrando os erros dela goela abaixo!

Sugiro testar e usar está primeira linha em todas as suas páginas. Sei que dá trabalho. Se for começar o site, comece certo. Vá trocando a linha a medida em que for atualizando páginas.

ATENÇÃO! EM AMBOS CASOS A LINHA FICA ENTRE < >, MAS SE COLOCAR ISSO NUMA POSTAGEM DO BLOGGER, A LINHA SIMPLESMENTE NÃO É MOSTRADA - DESCOBRIMOS MAIS UM BUG...


14 comentários:

Junior Netfio disse...

Comigo a inclusação desse código não resolveu, ficou a mesma coisa. Mas acredito ser algum erro meu. Aperasr de funcionar certo dos outros navegadores. No IE aparece todo o menu aberto e com a mensagem de bloqueio activex

Nukemp disse...

Olha, quero te dar os parabéns, funcionou como se fosse uma mágica rsrs, parabéns e muito obrigado resolveu o meu problema

fera disse...

nossa funciona mesmo, vlw muito obrigado

Educação à Distância disse...

desalinhou meu site, o que devo fazer?

Educação à Distância disse...

meu site ficou desalinhado

Castilho disse...

Estou com problema em colocar este codigo pois não da certo continua o mesmo erro no explorer pode ser o explorer 100 não funciona nos outros funcionam normal, mas eu não vu ficar pedindo para as pessoas nã usar o explorer mais no meu site rsrs. Alguem pode me ajudar pode me anviar um email para cncfs@castilhonoticias.com.br

Castilho disse...

Aguardo Alguma ajuda no email eu uso o frontpage para fazer meu site pois não sei trabalhar muito ainda com dream cs. obrigado

Ronaldo disse...

CARA mto obrigadoo...consegui achar a soluçao ...uma coisa tão simples e eu quebrando a cabeça..valeu...

Salvador Junior disse...

Muito obrigado, realmente resolveu meu problema!!! VALEWWWW!!!!

Marcelo L P disse...

As vezes a solução é mais simples do que parece...
Obrigado colega.

Diego Gonçalves disse...

q sacanagem... eu estava lendo q varias pessoas passavam por isso alem de mim e ficava indignado... pior q eu comecei a construir um site sem o doctype mesmo sabendo q deve se usar ele no codigo. por isso q nao funcionava no ie. muito obrigado por me lembrar do que eu havia esquecido

Diego Gonçalves disse...

putz. tinha ate esquecido desse. apesar de saber que o codigo deve conter eu estava construindo sem ele. obrigado por me lembrar do uso doctype. tava brigando com o ie por ele nao ler o css corretamente.

Caio disse...

Meu amigo....

Não sou muito de comentar em blogs, mas essa solução mereceu, rsrsrs.

Parabéns pela explicação clara e intuitiva, man.

Quem sabe um dia o IE num some da face da terra pra alegria da humanidade, rsrsrs



Abs e obrigado novamente!

Giso Alves,s disse...

Na internet Explorer 11, ele não funciona