Hier, j'ai vu un article de goos utilisant ucweb : Qui a dit que le menu Float ne pouvait pas être centré horizontalement ? des hacks.
J'ai ici un moyen plus simple, que je vais montrer en premier :
En fait, j'aurais dû mettre un autre div à l'extérieur, mais afin de réduire les émissions de carbone, je l'ai jeté.
Boîte de code d'exécution
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
http://www.w3.org/1999/xhtml ">
[Ctrl+A Sélectionner tous les conseils : vous pouvez d'abord modifier une partie du code, puis appuyer sur Exécuter]
La plus cruciale est cette phrase :
Afin de prendre en charge les versions inférieures d'IE, des commentaires conditionnels sont utilisés ici. Il semble que dans IE7 et versions antérieures, la fonction display:inline est équivalente à inline-block;.
La navigation par porte coulissante a évolué à partir du code ci-dessus :
Boîte de code d'exécution
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
http://www.w3.org/1999/xhtml ">
[Ctrl+A Sélectionner tous les conseils : vous pouvez d'abord modifier une partie du code, puis appuyer sur Exécuter]
Parmi elles, ces deux phrases méritent d’être explicitées pour éviter d’être considérées comme redondantes :
#navigation li a{overflow:hidden;} /* Masquer les 3px abandonnés par IE5.5 et 6. Ce n'est pas un bug 3px ! Parce que height:30px;line-height:33px; dans IE5.5 et 6, la hauteur est de 33px. */
#navigation li a span{cursor:hand;}/* Attention au bug dans IE 5.5, 6 et 7 où la souris n'affiche pas la forme d'une main lorsqu'elle est placée sur span. De plus, IE5.5 ne prend pas en charge curseur:pointeur mais toutes les versions d'IE reconnaissent curseur:main;*/
C'est fait. L'inconvénient est qu'écrire cette ligne de commentaires conditionnels est comme du sable dans les yeux pour les personnes atteintes de mysophobie xhtml. Si vous voulez vous en débarrasser, alors il n'y a aucun mal à utiliser un hack ! héhé !
Aucun problème n'a été trouvé dans safari4, chrome, opera10, ie5.5, 5, 6, 7, ff3.