Polices d'icône non chargées dans IE11

après avoir étudié le même problème, et en passant en revue diverses solutions publiées en ligne, j'ai créé la liste de dépannage suivante, qui couvre la plupart des causes potentielles:

1. les téléchargements de police sont désactivés dans IE, sous Options Internet / Sécurité / niveau personnalisé /les téléchargements de police activent / désactivent. Ils peuvent être désactivés par votre administrateur réseau, auquel cas vous ne pourrez pas voir ou modifier ce paramètre.
2. vos en-têtes HTTP empêchent IE de stocker le fichier de police local. Pour corriger, enlever tout Cache-Control: no-store, no-cache ou Pragma: no-cache en-têtes, ou tout Expires en-tête avec une date dans le passé. Aussi l' Vary header a ses trucs dans IE, si défini à autre chose que Accept-Encoding,User-Agent,Host ou Accept-Language IE ne cache rien, à moins queETAG en-tête est également présent (voir ce blog MSDN).
3. vous ne définissez pas les types MIME corrects pour le téléchargement de police. Par exemple Jetty 9 va mettre par par défaut Content-Type: text/plain pour les types de police habituels (eot, woff, woff2). Voir cette réponse pour les types de contenu appropriés à utiliser.
4. assurez-vous d'utiliser display: block ou display: inline-block pour votre élément icon.
5. Enfin, assurez-vous de passer par le guide de dépannage plus à FontAwesome.

j'ai eu un problème similaire et il semble être causé par IE ayant des difficultés avec certains display et position réglages en combinaison avec iconfonts.

Il devrait normalement travailler à l'aide de:

element:before {
     display:block;
     position: absolute;
     ... your styles ...
}

j'ai fait face à un problème similaire mais avec des icônes de police Bootstrap (Glyphicons). Vous pouvez essayer si cela fonctionne:

(généralement sous Windows 10) les paramètres de L'IE-11 ont été modifiés pour ne pas télécharger de polices externes et n'utiliser que les polices disponibles sous windows. C'est le comportement par défaut.

Cependant nous pouvons modifier ce paramètre dans IE pour lui permettre de télécharger des polices externes. Voici les étapes à suivre dans IE- Aller à: Paramètres > > Options Internet >> Sécurité

cliquez sur "Internet" (ou n'importe quelle zone que vous utilisez) > > " niveau personnalisé..."

Suivant dans la section 'Paramètres de sécurité ‘ - Activer’téléchargement de police'. Par défaut, il est désactivé.

rafraîchir la Page

la syntaxe est correcte, cependant il peut y avoir un problème avec la façon dont quel que soit le convertisseur que vous avez utilisé pour convertir à partir .la fft à la .eof. Voir ce l'article pour plus de détails sur cette question en général http://www.iandevlin.com/blog/2009/12/webdev/adventures-with-font-face

en attendant, vous pouvez essayer de tester le problème en utilisant une police hébergée par Google fonts. Je dis cela parce que Google gère la compatibilité entre navigateurs de façon transparente. Si il s'avère que le Google font fonctionne alors vous savez son un problème avec la façon dont votre police a été convertie et vous devez en essayer un autre. Ce que je comprends Police Écureuil est vraiment bon à générer de la croix-navigateur compatible polices. J'espère que cette aide, bonne chance

C'est le problème: https://docs.microsoft.com/en-us/windows/security/threat-protection/block-untrusted-fonts-in-enterprise#Turn_on_and_use_the_Blocking_untrusted_fonts_feature

en gros, Microsoft nous oblige à revenir à l'utilisation des feuilles sprite.

dans mon cas, il était corrompu .fichier de police eot. J'en avais généré un nouveau (+nouveau .CSS styles) et il a corrigé le problème. Essayer.

PS. Assurez-vous que vous soutenez EOT pour IE à @font-face, par exemple:

@font-face {
  font-family: "fontName";
  src:url("../../src/theme/fonts/fontName.eot");
  src:url("../../src/theme/fonts/fontName.eot?#iefix") format("embedded-opentype"),
  url("../../src/theme/fonts/fontName.woff") format("woff"),
  url("../../src/theme/fonts/fontName.ttf") format("truetype"),
  url("../../src/theme/fonts/fontName.svg#fontName") format("svg");
  font-weight: normal;
  font-style: normal;
}