Text-Shadow: IE8

Bon, je suis en train de mettre en œuvre text-shadow à travers les différents navigateurs. J'ai IE6, IE7, FF, Chrome et Opéra de travail... mais IE8 habitude "afficher les ombres, sauf si il est en "mode de Compatibilité'.

J'ai regardé un certain nombre de "solutions" via la fonction de recherche /Google, mais l'ombre est toujours, n'apparaissant que dans la Compatibilité de l'Affichage".

Des idées sur comment le faire, sans avoir à changer de mode?

Remarque: à l'Aide de HTML5 Boilerplate et Modernizr.

edit: Ajouté que je suis à l'aide de Modernizr, et j'ai cliqué sur le mauvais bouton dans mon testeur. Ce n'est pas au travail IE9, mais je ne pense pas que c'est lié.

CSS:

#links li a {
font-size: 24px;
text-shadow: 0 3px 3px #102530, 0 3px 3px #102530;
/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=90, Color='#102530')";
/* For IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=90, Color='#102530');
filter:DropShadow(Color=#102530, OffX=0, OffY=3);
zoom: 1;
}

HTML

<ul id="links">
    <li><a href="#"/>Text</a></li>
</ul>

source d'informationauteur David Bradbury

  1. 3

    Un site web ne doit pas nécessairement la même dans tous les navigateurs. Plus MME les filtres sont de la merde.
    Je vous recommande d'utiliser Moderniste d'appliquer une solution différente pour IE8.

    Il vous permettra d'économiser de maux de tête 🙂

  2. 11

    J'ai essayé Moderniste (également avec heygrady de polyfill). J'ai essayé cssSandpaper. J'ai essayé CSS3PIE. Mais aucun d'eux ne m'affiche un text-shadow dans Internet Explorer 8 (CSS3PIE n'a pas text-shadow). J'ai aussi essayé la double-balisage. Mais qu'on ne peut vraiment pas.

    Et puis j'ai trouvé Whykiki du blog et simplement ajouté filter: dropshadow(color=#000000, offx=2, offy=2); en combinaison avec display: block;. Et c'est tout. Certains d'entre vous pourraient essayer zoom: 1; au lieu de display: block; pour l'activer. filter: glow(color=#000000,strength=2); œuvres, trop. Comme vous le verrez, le MS dropshadow ne vient pas avec le flou. Je peux vivre avec ça.

    h1 {
  color: #fce934;
  text-shadow: 2px 2px 2px #000000;
  -moz-text-shadow: 2px 2px 2px #000000;
  -webkit-text-shadow: 2px 2px 2px #000000;
  filter: dropshadow(color=#000000, offx=2, offy=2);
  display: block; /* that's the important part */
}