Pourquoi Inline-Block ne fonctionne-t-il pas dans Internet Explorer 6 et 7 et comment puis-je y remédier ?

Problèmes de bloc en ligne dans Internet Explorer 6 et 7

Le concept de bloc en ligne dans CSS permet aux éléments de se comporter à la fois en ligne et en bloc -éléments de niveau simultanément. Cependant, si vous rencontrez des problèmes avec le blocage en ligne qui ne fonctionne pas dans Internet Explorer 6 et 7, vous n'êtes pas seul.

Le problème :

Par défaut , inline-block ne fonctionne que sur les éléments intrinsèquement en ligne, tels que les travées. L'appliquer à d'autres éléments comme les divs dans IE6 et IE7 peut conduire à un comportement imprévisible.

La solution :

Pour résoudre ce problème et activer le blocage en ligne sur les éléments non- éléments en ligne dans IE6/7, vous devrez utiliser une solution de contournement. Cela implique l'ajout du CSS suivant :

#yourElement {
    display: inline-block;
    *display: inline;
    zoom: 1;
}

Voici un aperçu de la solution de contournement :

• *display : inline est un hack CSS "sûr" qui cible IE7 et versions antérieures. Il remplace la propriété d'affichage définie par le bloc en ligne.
• zoom: 1 force IE6/7 à appliquer "layout" à l'élément. La mise en page est essentielle pour que le bloc en ligne fonctionne de manière cohérente.

Considérations supplémentaires :

Il est possible d'implémenter cette solution de contournement tout en conservant un CSS valide, mais ce n'est généralement pas le cas. recommandé, surtout si vous utilisez déjà d'autres préfixes spécifiques au fournisseur.

Pour plus d'informations sur l'affichage : inline-block, faites référence à des ressources externes, mais notez que -moz-inline-stack n'est plus nécessaire car il ne s'applique qu'à Firefox 2.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!