Um assunto meio complexo e interessante que muita gente se confundi na hora de entender. Doctypes e os modes dos browsers.
Acho que todos já ouviram falar em Box Model, não é?
Pois então… Alguns browsers calculam as medidas no CSS de um jeito particular, calculam do jeito antigo, errado, causando esse tipo de problema.
Muitos fizeram sites enquantos os browsers calculavam do jeito errado. Logo, os desenvolvedores dos browsers ficaram num dilema: Se eles resolvessem o “bug” de cálculo, muitos sites iriam parar de funcionar corretamente…
Resolveram criar um tipo de chaveamento para os browsers.
Hoje, os browsers atuais, funcionam do jeito antigo e do jeito certo, tudo depende do Doctype.
O jeito antigo é chamado de “Quirks Mode” e o jeito novo chama-se “Strict Mode” ou “Standard Mode”.
Para começar, se os browsers não encontram nenhum tipo de Doctype na página, o Internet Explorer e o Opera funcionam em “Quirks Mode”. Mas o Mozilla (e genéricos) funcionam em “Strict Mode”.
Se os browsers encontram um Doctype, como por exemplo, de HTML 3.0, eles funcionam “Quirks Mode”. Se encontram um Doctype mais novo, como XHTML ou até mesmo o HTML 4, eles funcionam em “Strict Mode”.
Abaixo, segue uma tabelinha para facilitar as coisas.
S / DOCTYPE
C / DOCTYPE
C / prolog
Quirks
Strict
Quirks
Quirks
Quirks
Quirks
Quirks
Strict
Strict
Quirks
Strict
Strict
Quirks
Strict
Strict
Alguns “poréns”:
Embora o Mozilla funcione em “Quirks Mode” sem o Doctype, ele calcula o Box Model da maneira correta.
Lembrando que há mais diferenças entre o “Quirks Mode” e o “Strict Mode”.
O Ie5, sempre se comportará do jeito antigo. O Ie6, se colocarmos o Prolog XML, ignora o Doctype (não importa qual seja) e passa a se comportar em “Quirks Mode”.
Eu, particularmente, recomendo colocar o Prolog XML, para fazer o Ie6 se comportar em Quirks Mode. Se eu precisar ajeitar o layout nos Ie’s, eu coloco um CSS Hack e resolve o problema.
Mais sobre esse assunto: