Appliquer uniquement à IE 11 dans les médias requête pour la taille de l'écran

Question

J'ai actuellement la requête de largeur de média spécifique suivante.

@media only screen and (max-width: 1920px) { 
    .toggleMultiSelect .filter { 
     width: 566px; 
    } 
} 

Mais la largeur pour '.toggleMultiSelect .filter' changements dans IE de Chrome/Firefox. Donc, fondamentalement, besoin d'appliquer une largeur différente pour la même classe CSS en 1920px pour IE. De la recherche de Stackoverflow j'ai trouvé que le comportement spécifique d'IE peut être réalisé comme ci-dessous.

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { 
    .toggleMultiSelect .filter { 
     width: 575px; 
    } 
} 

Maintenant, j'ai besoin d'atteindre à la fois la résolution et la classe css. 575px largeur ne devrait s'appliquer à IE et Chrome ou Firefox devrait obtenir 566px.

Merci d'avance pour toute aide.

Answer 1

Utilisez le dessous à l'intérieur de la requête css média

IE 10 et au-dessus

_: - ms-lang (x), .ie10up {propriété: valeur; }

IE 11 et au-dessus

_: - ms-plein écran,: .CLASS_NAME racine {propriété: valeur; }

Answer 2

Avez-vous essayé de les combiner comme ça -

@media only screen and (max-width: 1920px) { 
    .toggleMultiSelect .filter { 
     width: 566px; 
    } 
    @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { 
     .toggleMultiSelect .filter { 
     width: 575px; 
     } 
    } 

} 

Cela peut fonctionner suis pas sûr, je utilise Mac donc aucun moyen de tester, mais je pense que cela fonctionnera pour vous. J'espère que cela a été utile.