Si vous développez régulièrement des sites web et utilisez des CSSs, vous avez forcément déjà été confrontés aux bugs d’Internet Explorer dans leur interprétation.
Et comme souvent en entreprise, pas possible de laisser tomber la compatibilité IE.
Voici quelques uns des soucis les plus courants sous IE :
Le modèle de boîtes
Un des bugs les plus courants d’IE : si vous déclarez le div suivant :
div#box {
width: 100px;
border: 2px solid black;
padding: 10px;
}
IE 6 affichera une boîte de 100px.
La norme CSS demande une boîte de 124px.
Une solution est de ne pas utiliser de padding et d’imbriquer plusieurs boîtes … loin d’être idéal pour la lisibilité.
La double marge
En utilisant le code suivant, les marges seront doublées sous IE 6 :
div#box {
float: right;
margin-right: 20px;
}
Vous obtiendrez une marge de 40px. Pour résoudre ce problème, ajoutez un display: inline; à la définition du div.
Pas de min-width ou min-height
Ca c’est top : IE ignore purement et simplement les min-width et min-height.
[ Une solution possible ]
Sauts de ligne après les floats
Quand vous utilisez des floats avec IE6, vous pouvez avoir la bonne blague de les voir se décaler vers le bas :
Une solution est de mettre la *line-height* du parent à 0. Plus d’informations sur cette page :
[ Preventing StepDown ]
Pas de gestion des PNGs transparents
Bon, on va arrêter là, yen a plein d’autres !
Allez faire un tour sur le site suivant, vous trouverez le détail des différents éléments et d’autres solutions !
Netcat, aussi surnommé le couteau suisse du TCP/IP, peut être utilisé aussi bien pour de bonnes choses que pour de mauvaises.