Peut quelqu'un s’il vous plaît m’aider à obtenir ma tête autour de ce bug ? Avec Firefox sa marche bien, mais avec Internet Explorer 7 ce n’est ne pas. Il ne semble ne pas comprendre le `` .
HTML :
CSS :
Réponses
Trop de publicités?
Les IE7 display: inline-block; hack est comme suit:
display: inline-block;
*display: inline;
zoom: 1;
Par défaut, IE7 ne supporte inline-block sur naturellement inline éléments (Quirksmode Tableau de Compatibilité), de sorte que vous aurez besoin de ce hack pour d'autres éléments.
zoom: 1 est là pour déclencher hasLayout comportement, et nous utilisons la star de la propriété hack pour le réglage de la display de inline seulement dans IE7 et inférieur (les navigateurs les plus récents de ne pas l'appliquer). hasLayout et inline ensemble va déclencher inline-block comportement dans IE7, donc nous sommes heureux.
Cette CSS ne sera pas validé, et peut rendre votre feuille de style foiré de toute façon, alors à l'aide d'un IE7 seule feuille de style par le biais des commentaires conditionnels pourrait être une bonne idée.
<!–-[if IE 7]>
<link rel="stylesheet" href="ie7.css" type="text/css" />
<![endif]–->
HerrSerker
Points
9005
Mise à jour
Comme personne ne l'utilise IE6 et 7 plus je vais vous présenter une solution différente:
Vous n'avez pas besoin d'un hack plus, parce que IE8 soutient par elle-même
Pour ceux qui doivent soutenir ceux de l'âge de pierre des navigateurs avant de IE8 (Ce n'est pas que la IE8 est que le vieux, trop la toux):
Pour le compte de l'ei contrôle de version, l'utilisation Conditionnelle de Classe en <html>balise comme Paul Irlandais unis dans son article
<!--[if IE 7]><html class="no-js lt-ie9 lt-ie8"><![endif]-->
<!--[if IE 8]><html class="no-js lt-ie9"><![endif]-->
<!--[if gt IE 8]><!--><html class="no-js"><!--<![endif]-->
Par la présente, vous aurez différentes classes dans la balise html pour différents Navigateurs IE
Le CSS que vous avez besoin est comme suit
.inline-block {
display: inline-block;
}
.lt-ie8 .inline-block {
display: inline;
zoom: 1;
}
Cela permettra de valider et vous n'avez pas besoin d'un supplément de fichier CSS
Vieille réponse
.frame-header
{
background:url(images/tab-green.png) repeat-x left top;
height:25px;
display:-moz-inline-box; /* FF2 */
display:inline-block; /* will also trigger hasLayout for IE6+7*/
}
/* Hack for IE6 */
* html .frame-header {
display: inline; /* Elements with hasLayout and display:inline behave like inline-block */
}
/* Hack for IE7 */
* + html .frame-header {
display: inline; /* Elements with hasLayout and display:inline behave like inline-block */
}
Iladarsda
Points
1812
IE7 ne supporte pas les « inline-block » correctement, plus d’infos ici : LINK
Utilisation peut utiliser : « inline » à la place.
Qu’essayez-vous exactement à atteindre ? Nous faire un exemple et mettre ici : http://jsfiddle.net/
MiddleKay
Points
84
