Compatibilité IE 5 et 5.5
filtres/hacks
Quelques modifications sont nécessaires pour que le menu1 de gauche s'affiche mieux avec IE 5 et IE 5.5 :
Il nous faut toujours deux feuilles de style :
pagecss2nn4.css contenant les règles qui sont ignorées ou correctement interprétées par nn4.
pagecss2.css avec les nouvelles règles et ce qui pose problème.
Quelques filtres ou "hacks" vont permettre la compatibilité.
On ajoute (mais en fait on modifie plutôt pagecss2nn4.css)
<link rel="stylesheet" href="pagecss2nn4.css" type="text/css" /> <style type="text/css"> <!-- /*<![CDATA[*/ /*n'est pas interprété par nn4 ou ie4*/ @import "pagecss2.css";/*écrase les styles précédemment définis*/ /*modifications à apporter mais plutôt dans pagecss2nn4*/ #menugauche li{ margin-top:0; border-bottom:0; border-top:1px solid #90BADE; margin-bottom:-5px; border-bottom/*ignoré par IE5.0/Win à partir d'ici*/:1px solid #90BADE; margin-bottom:-1px; } /*3 solutions pour régler la largeur du menu*/ /*solution 1*/ #menugauche li a{ width:155px; w\idth:135px;/*ignoré par IE5,IE5.5/Win et Konqueror ->3.2 !*/ } html>body #menugauche li a{ width:135px;/*lu par Konqueror, ignoré par MSIE*/ } /*solution 2 : on ne redéfinit la règle que pour MSIE*/ * html #menugauche li a{ width:155px;/*ou width:100%;*/ w\idth:135px;/*ne sera lu que par MSIE 6*/ } /* solution 3 des commentaires conditionnels */ /*]]>*/ --> </style>
Il n'y aura donc pas de changement pour les autres navigateurs.
Gauche
Centre
Droite
Le texte disparaît
s'il dépasse
les possibilités de l'écran
afin de conserver
l'alignement.
Colonne de gauche large
colonne étroite
texte centré
caractères gras
CSS uniquement, pas de tableau ni javascript.
Les utilisateurs de MSIE 5 ou 5.5 sont de moins en moins nombreux mais assez pour qu'un test de compatibilité s'impose.
MSIE 7 risque de bouleverser les choses car il devrait lire html > body, body > element, head:first-child + body et ne plus lire le "star hack" (* html).
Si cela se confirme, utiliser des commentaires conditionnels pour les différentes versions de MSIE deviendra l'option la plus raisonnable.
1 CSS cutting edge propose d'autres solutions sans liste pour des menus horizontaux et verticaux.
1 Autres solutions pour des menus horizontaux et verticaux.