Ne jamais oublier de mettre un DOCTYPE dans une page web et toujours vérifier qu’elle est complète ET correcte.
J’étais en train de naviguer sur un site web lorsque j’ai remarqué que le centrage du site ne fonctionnait pas sur Internet Explorer 8. J’ai mis en place mes solutions gagnantes pour le centrage du futur site de fuu-doh.com dans l’outil de débogage intégré à l’explorateur (touche F12 pour votre information).
Hélas, malgré mes nombreuses tentatives, cela n’avait pas fonctionné. Puis j’ai remarqué que la syntaxe n’était pas du XHTML, mais apparemment du HTML 4.0 Transitional. Ce n’est pas un mal en soi, j’ai juste dû m’habituer à ces horribles balises en majuscules. Puis j’ai sauvegardé en local cette fameuse page pour aller plus loin dans le débogage en supprimant tout ce qui n’était pas nécessaire, en ne laissant qu’un seul <div> à centrer. En vain.
À ce moment là, je n’avais plus comme solution que de changer la page de HTML 4.0 Transitional vers XHTML. Et là, ça fonctionne ! Alors, en fait, ce n’est pas grâce au XHTML que cela avait fonctionné. Lorsque j’ai relu la version précédente, le DOCTYPE était… incomplet. Il manquait le lien vers la page du DTD situé sur le site w3.org . Ainsi, le fait de n’avoir que ça :
1 <!DOCTYPE HTML PUBLIC « -//W3C//DTD HTML 4.0 Transitional//EN »>
… va empêcher le bon traitement de certaines fonctionnalités de la page, notamment le CSS et le fameux margin-left:auto et margin-right:auto qui centrent le contenu. Alors que le DOCTYPE suivant active de nouveau ces fonctionnalités particulières :
1 <!DOCTYPE HTML PUBLIC « -//W3C//DTD HTML 4.0 Transitional//EN » « http://www.w3.org/TR/html4/loose.dtd »>
En espérant rendre service aux rares malheureux développeurs de sites web qui sont tombés dans ce piège.