web-dev-qa-db-fra.com

Besoin de bidouiller pour IE9 seulement

Y at-il un hack pour cibler IE9 uniquement? Je suis confronté à un problème dans IE9 uniquement, les autres navigateurs fonctionnent bien. J'utilise \9, mais cela concerne également IE8.

Je ne veux pas utiliser de commentaires conditionnels.

10
supersaiyan

Vous pouvez utiliser ce :root #element { color:pink \0/IE9; } /* IE9 + IE10pp4 */

21
sandeep

Je suis venu avec une requête des médias qui fait cela aussi. Il spécifie uniquement IE9. 

@media all and (min-width:0\0) and (min-resolution:.001dpcm)
{
    #div { color:red; }
}

D'autres solutions que j'ai élaborées, notamment une requête multimédia msie 9+, se trouvent sur ma page github: https://github.com/jeffclayton/css_hack_testing - la plupart d'entre elles ont été envoyées à browserhacks.com pour inclusion.

2017 UPDATE : Pour le voir fonctionner, j'ai créé une page de test en direct ici pour cela et beaucoup d'autres sur lequel j'ai travaillé sur http://browserstrangeness.bitbucket.io/css_hacks.html et MIRROR: http://browserstrangeness.github.io/css_hacks.html

Veuillez noter qu'il s'agit de min-width: 0\0 (zéro-backslash-zero) lorsque vous copiez le code sur votre propre site. Ne pas confondre avec min-width: 0 (un seul zéro) qui ne permet pas de différencier IE9 des autres navigateurs.

14
Jeff Clayton

Il y a un autre moyen! 

:root #div { background: #fff \0/IE9; }  /* IE9 */

Utilisez le sélecteur :root psuedo. Cela fonctionne car la partie @media all and (min-width:0) a été supprimée au profit de cette méthode dans IE9. 

Sachez cependant que ce n'est pas une méthode sûre car cela ne fonctionne pas sur tous les sélecteurs. La meilleure chose à utiliser est d'utiliser des commentaires conditionnels. C'est le moyen le plus sûr, le plus simple et le meilleur de cibler différentes versions d'Internet Explorer, à l'exception d'IE10 qui a abandonné la prise en charge des commentaires conditionnels.

5
Kyle

Dans mon émulateur IE9, aucune des solutions répertoriées ne fonctionnait. Le seul piratage qui nous a permis de redimensionner correctement, par exemple, une case à cocher dans IE9 était:

/* IE9 */
:root input#my-checkbox {
    width:20px !important \ ;
    height:20px !important \ ;
    box-sizing:content-box !important \ ;
}

Je je ne sais pas si cela concerne également IE8 ou IE10, etc.

Espérons que cela aide quelqu'un.

0
cbmtrx