Certain websites are showing little boxes with things like EO/55, EO/0$ in them instead of the graphics that are intended to show up
A great many websites are now displaying small boxes with strings of letters or numbers where icons used to be present. Netflix and AOL are my primary examples but there are many others. Many of these boxes appear where there should be some kind of interactive icon (like a forward or back button or a play button on netflix). I have checked the settings for allowing a website to choose it's own font and it is set to allow websites to do that. I have included a screen shot with the area's of concern circled in red.
Any help would be much appreciated.
All Replies (20)
Here is the image.
I've spent the whole day searching for a solution for the same issue (no icons in Firefox though it was all fine in other browsers), and finally I found it! The culprit is Windows Firewall. Just disable it in Control Panel, not in Services. That's all.
Missing icons are usually supplied by a font that is downloaded from the server (@font-face) as you might see by little boxes that show the hex code of the characters instead. If you have a font installed that covers this Unicode range then you may see a real (CJK) character and not the little box with the CSS code.
Make sure that you allow pages to choose their own fonts.
- Tools > Options > Content : Fonts & Colors > Advanced: [X] "Allow pages to choose their own fonts, instead of my selections above"
You can check the gfx.downloadable_fonts.enabled pref on the about:config page and make sure that it is set to true (if necessary double-click the line to toggle its value).
You can open the about:config page via the location/address bar. You can accept the warning and click "I'll be careful" to continue.
Modified
Hi lan4, you shouldn't have to disable an entire firewall because some files are blocked. Hopefully there is a less drastic solution, such as allowing WOFF files, if those are what is being blocked.
I have to add, I've tried all that explained in the post above but it didn't work for me. Then cleared cache, hit "Refresh Firefox" button, tried Safe Mode... I even uninstalled and cleaned the registry with different tools, then installed the latest version with no add-ons. Nothing helped. Then I discovered I couldn't install any fonts at all, and searched for that problem. Disabling Firewall solved all.
@jscher2000, I had it disabled in Services anyway, because I'm using other Firewall so I don't need two of them. But it had to be disabled in Control panel and not just because of the icons in Firefox but I couldn't install or preview any fonts at all.
lan4 said
@jscher2000, I had it disabled in Services anyway, because I'm using other Firewall so I don't need two of them.
Okay, gotcha. Windows should have managed that for you, but somehow fell down on the job.
So I've tried all that Cor-el mentioned previously. I don't use windows firewall and have no issues with any other browser. Any other thoughts?
Then it's probably some extension. Are you using NoScript? Try with Firefox in Safe Mode: https://support.mozilla.org/en-US/kb/troubleshoot-firefox-issues-using-safe-mode#w_how-to-start-firefox-in-safe-mode
Same problem occurs in safe mode.
Hi dekante, does this affect all downloadable fonts? If you right-click text on this page, Inspect Element (Q), then the Inspector should open with that element selected in an HTML tree-style list. On the right side, the Rules panel usually is selected, but if you click Fonts, is it showing Open Sans?
It says Opens sans on the mozilla help page, but AOL for example has Ariel selected in the Hex boxes.
Unfortunately I can't get to an AOL page that looks like yours, so I'm not able to investigate where the fonts load from.
Do the AOL and Netflix pages look normal in Internet Explorer or any other browsers you might have installed?
Is there anything special about the way Firefox connects to the web? You can check here:
"3-bar" menu button (or Tools menu) > Options > Advanced > Network mini-tab
Click the "Settings" button. The default of "Use system proxy settings" piggybacks on your Windows/IE "LAN" settings, but you also can try "No proxy" to see whether that makes any difference.
Are there any error messages in the Web Console (Firefox/Tools > Web Developer) about downloading fonts?
You can check the Net log and the Network tab in the Web Console (Firefox/Tools > Web Developer) to see if content fails to load or possibly is blocked (file size is zero).
Use Ctrl+F5 or Ctrl+Shift+R to reload the page and bypass the cache to generate a fresh log.
This is starting to get beyond me. I've found many websites now that are not loading the fonts for clickable icons. Netflix, Thinkgeek, some links off Facebook, AOL, etc. What is weird is that some websites look normal and function appropriately. I am not computer savvy enough to make heads or tails of the web console so if it is that broken, I may just need to use a different browser. That makes me sad.
That being said, in the console I have a lot of downloadble font failures for the website I trialed (thinkgeek). Image attached. Any easy fix?
Modified
What those errors refer to is that Firefox won't get downloadable fonts from sites that do not allow cross-site use. For the FontAwesome icons, for example, Firefox sends a request including these headers:
Referer: http://a.tgcdn.net/css/styles.min.1439418356.css Origin: http://www.thinkgeek.com
And then the server sends a response that includes this header:
Access-Control-Allow-Origin: http://www.thinkgeek.com
So Firefox knows the other site gives permission for the main site to use its font file. For some reason, that process is failing on your Firefox.
Could you check to see whether any "referer" preferences have been modified? (Yes, it is misspelled...)
(1) In a new tab, type or paste about:config in the address bar and press Enter/Return. Click the button promising to be careful.
(2) In the search box above the list, type or paste referer and pause while the list is filtered
(3) If any of these preferences are bolded and show they are "user set", try using right-click > Reset to restore them to their normal values:
- network.http.referer.XOriginPolicy
- network.http.referer.spoofSource
- network.http.referer.trimmingPolicy
- network.http.sendRefererHeader
If you made a change, try reloading the problem page and see whether it can get the fonts now, or you get the same error.
Thanks for taking the time to explain that. Unfortunately, It seems that none of the referer settings were user set and so I had nothing to fix. This is very frustrating. I have another machine that Firefox runs flawlessly on and it used to run normally on this one too.
There might be some other specific settings I am not aware of. To test whether your Firefox installation might be broken or there might be an external factor, could you test with clean settings as follows:
Create a new Firefox profile
A new profile will exist in parallel to your current profile. It will have your system-installed plugins (e.g., Flash) and extensions (e.g., security suite toolbars), but no themes, other extensions, or other customizations. It also should have completely fresh settings databases and a fresh cache folder.
Exit Firefox (if applicable) and start up in the Profile Manager using the Start menu search box, type or paste the following and press Enter:
firefox.exe -P
A small Profile Manager dialog should appear. Don't delete anything here!
Any time you want to switch profiles, exit Firefox and return to this dialog.
Click the Create Profile button, assign a name like TEST081415, and skip the option to relocate the profile folder. After creating the profile, select it and start Firefox in that profile.
Can Firefox load the downloadable fonts in the clean profile?
When returning to the Profile Manager, you might be tempted to use the Delete Profile button. But... it's a bit too easy to accidentally delete your "real" profile, so I recommend resisting the temptation. If you do want to clean up later, I suggest making a backup of all your profiles first in case something were to go wrong.
If a clean profile also cannot download fonts, some program files might be damaged. For that, I suggest:
Clean Reinstall
We use this name, but it's not about removing your settings, it's about making sure the program files are clean (no inconsistent or alien code files). As described below, this process does not disturb your existing settings. Do NOT uninstall Firefox, that's not needed.
(1) Download a fresh installer for Firefox 40.0.2 from https://www.mozilla.org/firefox/all/ to a convenient location. (Scroll down to your preferred language.)
(2) Exit out of Firefox (if applicable).
(3) Rename the program folder, either:
(64-bit Windows folder names)
C:\Program Files (x86)\Mozilla Firefox
to
C:\Program Files (x86)\OldFirefox
(32-bit Windows folder names)
C:\Program Files\Mozilla Firefox
to
C:\Program Files\OldFirefox
(4) Run the installer you downloaded in #1. It should automatically connect to your existing settings.
Any difference?
Note: Some plugins may exist only in that OldFirefox folder. If something essential is missing, look in these folders:
- \OldFirefox\Plugins
- \OldFirefox\browser\plugins
So I followed the steps above and had no change with either the new profile or the clean reinstall.
It sounds as though something external is blocking these font downloads, but I don't know what it is or how it's doing it.
Privacy features of security software come to mind, but why it only affects Firefox is a puzzle.
Is there anything special about how you connect to websites, such as a private VPN, Tor, or similar?