Join the AMA (Ask Me Anything) with the Firefox leadership team to celebrate Firefox 20th anniversary and discuss Firefox’s future on Mozilla Connect. Mark your calendar on Thursday, November 14, 18:00 - 20:00 UTC!

This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

ابحث في الدعم

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Font Face src Problem with Icomoon

  • 3 ردود
  • 1 has this problem
  • 1 view
  • آخر ردّ كتبه yutonet

more options

Hi, There is an issue with icomoon fonts with the new Firefox. Firefox seems to be ignoring the actual glyphs and replacing them with some other (maybe built-in) icons. This problem wasn't existent before the big Firefox update.

You can see this in the screenshot attached (icons on the top right were supposed to be social network icons e.g. facebook instagram etc.) The web page mentioned is accessible at http://ordaf.org/

The problem is about the url of the font file being altered. Here's the font-face css code for the web page: @font-face {

   font-family: icomoon;
   src: url(fonts/icomoon.eot);
   src: url(fonts/icomoon.eot#iefix) format('embedded-opentype'), url(fonts/icomoon.ttf) format('truetype'), url(fonts/fonts/icomoon.woff) format('woff'), url(fonts/icomoon.svg#icomoon) format('svg');
   font-weight: 400;
   font-style: normal

}

And this is what I get on the developer tools: @font-face {

 font-family: "icomoon";
 font-style: normal;
 font-weight: 400;
 src: url("moz-extension://8eaa4596-3cd0-4168-bee4-6708c37d8684/fonts/icomoon.ttf?gbkn1h") format("truetype"), url("moz-extension://8eaa4596-3cd0-4168-bee4-6708c37d8684/fonts/icomoon.woff?gbkn1h") format("woff"), url("moz-extension://8eaa4596-3cd0-4168-bee4-6708c37d8684/fonts/icomoon.svg?gbkn1h#icomoon") format("svg");

}

Looking forward for a workaround for this, since the webpage is owned by me and I faced this problem with some other pages I've been working on.

Hi, There is an issue with icomoon fonts with the new Firefox. Firefox seems to be ignoring the actual glyphs and replacing them with some other (maybe built-in) icons. This problem wasn't existent before the big Firefox update. You can see this in the screenshot attached (icons on the top right were supposed to be social network icons e.g. facebook instagram etc.) The web page mentioned is accessible at http://ordaf.org/ The problem is about the url of the font file being altered. Here's the font-face css code for the web page: @font-face { font-family: icomoon; src: url(fonts/icomoon.eot); src: url(fonts/icomoon.eot#iefix) format('embedded-opentype'), url(fonts/icomoon.ttf) format('truetype'), url(fonts/fonts/icomoon.woff) format('woff'), url(fonts/icomoon.svg#icomoon) format('svg'); font-weight: 400; font-style: normal } And this is what I get on the developer tools: @font-face { font-family: "icomoon"; font-style: normal; font-weight: 400; src: url("moz-extension://8eaa4596-3cd0-4168-bee4-6708c37d8684/fonts/icomoon.ttf?gbkn1h") format("truetype"), url("moz-extension://8eaa4596-3cd0-4168-bee4-6708c37d8684/fonts/icomoon.woff?gbkn1h") format("woff"), url("moz-extension://8eaa4596-3cd0-4168-bee4-6708c37d8684/fonts/icomoon.svg?gbkn1h#icomoon") format("svg"); } Looking forward for a workaround for this, since the webpage is owned by me and I faced this problem with some other pages I've been working on.

Modified by yutonet

الحل المُختار

OK got it. This is related to the WX Download Status Bar plugin somehow. https://addons.mozilla.org/en-US/firefox/addon/wx-download-status-bar/

Read this answer in context 👍 0

All Replies (3)

more options

Please see :

Why not use Font Awsome, less hassel :

Please let us know if this solved your issue or if need further assistance.

more options

Firefox altering the font sources in CSS has nothing to do with icomoon, and icomoon is quite different than fontawesome by concept.

more options

الحل المُختار

OK got it. This is related to the WX Download Status Bar plugin somehow. https://addons.mozilla.org/en-US/firefox/addon/wx-download-status-bar/