y at-il IE8 seulement hack css?

Utilisez les requêtes média pour séparer chaque navigateur:

/* IE6/7 uses media, */
@media, { 
        .dude { color: green; } 
        .gal { color: red; }
} 

/* IE8 uses \0 */
@media all\0 { 
        .dude { color: brown; } 
        .gal { color: orange; }
} 

/* IE9 uses \9 */
@media all and (monochrome:0) { 
          .dude { color: yellow\9; } 
          .gal { color: blue\9; }
} 

/* IE10 and IE11 both use -ms-high-contrast */
@media all and (-ms-high-contrast:none)
 {
 .foo { color: green } /* IE10 */
 *::-ms-backdrop, .foo { color: red } /* IE11 */
 }

Références à

• Liste alphabétique des références CSS * Webplatform Docs

• Extensions du fournisseur Microsoft CSS

Utilisez \0.

color: green\0;

Je recommande cependant commentaires conditionnels puisque vous souhaitez exclure IE9 et il est encore imprévisible si ce hack affectera IE9 aussi bien ou non.

Quoi qu'il en soit, je n'ai jamais eu besoin d'un hack spécifique à IE8. Qu'est-ce que c'est, le problème spécifique IE8 que vous souhaitez résoudre? Est-il rendu en mode normes IE8 de toute façon? Son rendu est assez bon.

Si nécessaire de petits changements dans l'utilisation de CSS \9 il cible IE8 et ci-dessous (IE6, IE7, IE8)

.element { 
   color:green \9;
 }

La meilleure façon est d'utiliser des commentaires conditionnels en HTML, comme ceci:

<!--[if IE 8]>
<style>...</style>
<![endif]-->

Faire quelque chose comme ça devrait fonctionner pour vous.

<!--[if IE 8]> 
<div id="IE8">
<![endif]--> 

*Your content* 

<!--[if IE 8]> 
</div>
<![endif]--> 

Alors votre CSS peut ressembler à ceci:

#IE8 div.something
{ 
    color: purple; 
}

Donc, une question récente m'a incité à remarquer un hack de jeu de sélecteurs pour exclure IE 8 seulement.

.selector, #excludeIE8::before {} cela entraînera IE 8 à jeter l'ensemble du sélecteur, tandis que 5-7 et 9-11 le liront très bien. N'importe lequel des sélecteurs :: (::first-line, ::before, ::first-letter, ::selection) fonctionnera, j'ai simplement choisi ::before de sorte que la ligne se lit avec précision. Notez que le but du sélecteur faux ::before est de être faux, alors assurez-vous de le changer en autre chose si vous avez réellement un élément avec L'ID excludeIE8

Il est intéressant de noter que dans les navigateurs modernes (FF 45-52, GC 49-57, Edge 25/13), un mauvais sélecteur:: mange l'ensemble des sélecteurs (dabblet demo ). Il semble {[13] } que la dernière version Windows de Safari (et LTE IE 7, lol) n'a pas ce comportement tout en comprenant ::before. De plus, Je ne trouve rien dans la spécification pour indiquer que c'est un comportement prévu, et comme cela provoquerait une rupture sur n'importe quel sélecteur set contenant: ::future-legitimate-pseudoelement... Je suis enclin à dire que c'est un bug - et qui va grignoter nos arrières à l'avenir.

Cependant, si vous voulez seulement quelque chose au niveau de la propriété (plutôt que le niveau de la règle), Ziga ci-dessus avait la meilleure solution en ajoutant  \9 (l'espace est la clé; ne copypaste pas que inline car il utilise un nbsp):

/*property-level hacks:*/
/*Standards, Edge*/
prop:val;
/*lte ie 11*/
prop:val\9;
/*lte ie 8*/
prop:val \9;
/*lte ie 7*/
*prop:val;
/*lte ie 6*/
_prop:val;

/*other direction...*/
/*gte ie 8, NOT Edge*/
prop:val\0;

Note de côté, je me sens comme un nécromancien sale-mais je voulais quelque part documenter le jeu de sélecteur exclude-IE8-only hack I trouvé aujourd'hui, et cela semblait être l'endroit le plus approprié.

Ne pouvez-vous pas utiliser le hack que vous avez déjà montré, puis utiliser un hack IE7 et ci-dessous pour le remplacer?

Il existe différentes façons d'obtenir une classe sur L'élément HTML, en identifiant la version IE avec laquelle vous êtes en conflit: Modernizr , Le HTML 5 Boilerplate, etc - ou simplement rouler le vôtre. Ensuite, vous pouvez utiliser cette classe (P ex. lt-ie9) dans un sélecteur CSS normal, aucun hack nécessaire. Si vous voulez seulement affecter IE8 et non les versions précédentes, remettez l'ancienne valeur en utilisant un sélecteur. lt-ie8.

Cela fonctionnera pour les Versions IE8 ci-dessous

.lt-ie9 #yourID {

Votre code css

}

Pour le navigateur natif IE8 seul:

.classname{
    *color: green; /* This is for IE8 Native browser alone */
}

Je cherchais une bonne option pour IE10 et le style CSS ci-dessous (mais cela ne fonctionnerait que pour IE8) et j'ai eu cette idée:

<!--[if lt IE 10]><div class="column IE10-fix"><![endif]-->
<!--[if !lt IE 10]><!--><div class="column"><!--<![endif]-->

Je déclare mon div ou ce que vous voulez avec une classe supplémentaire, cela me permet d'avoir des CSS supplémentaires dans la même feuille de style d'une manière très lisible.

C'est W3C valide et pas un hack CSS bizarre.