[RÉGLÉ] icons qui ne s'affichent pas sur certains navigateurs ?

[elizabeth]

Bonjour à tous,

J'ai mis des icons (cadenas, home)... dans mon menu, mais ils ne s'affichent pas sur mon explorer, ils s'affichent sur mon navigateur chrome mais pas sur le navigateur chrome de mes clients, ça fonctionne sous opéra, mais pas sous firefox.
Bizarre, non ?

[woluweb]

problème de cache ?

https://vider-mon-cache.fr/

[elizabeth]

Non... Mes clients n'avaient jamais affiché le site. De mon côté j'ai vidé le cache, et c'est pareil.

[elizabeth]

Voici une copie d'écran qui montre le bon affichage sur mon navigateur chrome, et un affichage bizarre sur firefox. Sur exporer il n'y a rien.

[cavo789]

Salut Elizabeth

Que vois-tu dans ta console, onglet réseau ? Est-ce que ta fonte est bien chargée ? Pas de mixed content ?

[elizabeth]

Bonjour Christophe,

merci de ton aide,

voici ce qu'affiche l'onglet réseau :

[cavo789]

Hello

Dans la console, tu vois des erreurs ? Car ici, on voit des codes 200 (parfait) et des codes 303 (https://developer.mozilla.org/fr/doc...TTP/Status/303) et je ne suis pas tout à fait convaincu que la fonte web a bien été téléchargée. De prime abord, j'aurais tendance à dire qu'un 303 redirige vers une autre URL et que cette autre URL aurait dû être affichée juste sous la requête 303 mais avec un code 200 et ce n'est pas le cas sur ton image.

Je ne suis pas du tout affirmatif; je me questionne ici sur le réel téléchargement de la fonte (tu constateras que toutes les fontes sont en 303).

[elizabeth]

Ce que je trouve étonnant, c'est que ça fonctionne sur mon chrome et mon opéra.
Je viens de trouver une erreur sur la console d'explorer :
"downloadable font: rejected by sanitizer (font-family: "FontAwesome" style:normal weight:400 stretch:100 src index:0) source:https://xxxx.xxx/warp/vendor/uikit/fonts/fontawesome-webfont.woff2"

[daneel]

Bonsoir,

A mon avis, ce sont des erreurs de sécurité. C'est possible que ce soit des problème de partage de ressources ( CORS : Cross-origin resource sharing)
https://developer.mozilla.org/fr/docs/Web/HTTP/CORS

Vous avez déjà des erreurs sur votre propre site que j'ai indiqué dans un message privé pour des mesures de sécurité.
Non seulement du mixed-content mais également du duplicate content.

Vous pouvez corriger rapidement ces problèmes afin d'éliminer toute source d'erreurs, n'hésitez pas à en faire une petite checklist à adopter pour vos prochains sites.

Yann

[elizabeth]

Bonjour à tous, et merci de votre aide.
Voici la solution : il faut ajouter au custom.css ceci :

@font-face {
font-family: 'FontAwesome';
src: url('../warp/vendor/uikit/fonts/fontawesome-webfont.eot');
src: url('../warp/vendor/uikit/fonts/fontawesome-webfont.eot') format('embedded-opentype'),
url('../warp/vendor/uikit/fonts/fontawesome-webfont.woff2') format('woff2'),
url('../warp/vendor/uikit/fonts/fontawesome-webfont.woff') format('woff'),
url('../warp/vendor/uikit/fonts/fontawesome-webfont.ttf') format('truetype'),
url('../warp/vendor/uikit/fonts/fontawesome-webfont.svg') format('svg');
font-weight: normal;
font-style: normal;
}

merci !