Search Support

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

Cuireadh an snáithe seo sa chartlann. Cuir ceist nua má tá cabhair uait.

Font appears messed up only on Mozilla, only on one PC

more options

Hello!

So, I was working on a new blog on which I'm using the Rubik font from Google fonts.

Everything was fine for several days, but today, after working for some time on it, the font just got messed up randomly (see attached image).

I added the font on a different, testing site and it shows messed up there as well, so it's not something website related.

Now, the shocking part is that it gets messed up only on Mozilla and only on the Mozilla browser that's on my Desktop PC.

I asked a friend to check it out and I also checked it out on my laptop, and the font is fine on other Mozilla browsers, as well as other browsers.

Other fonts from other websites are fine as well.

What troubleshooting I performed:

- Checked the font with Inspect Element, as it's shown here: https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Edit_fonts and the font is set up correctly;

- Deleted the whole history since the beginning of time (cookies, cache, everything);

- Closed and opened Firefox again;

- Opened Mozilla in Safe Mode (hardware acceleration is disabled by default in safe mode);

- Restarted my PC;

- Uninstalled Mozilla as it shows here - https://support.mozilla.org/en-US/kb/uninstall-firefox-from-your-computer. Deleted the profile folder and everything.

- Installed a fresh copy again with no add-ons, no nothing.

Nothing worked. That font is still messed up on Mozilla, on this PC.

It doesn't make any sense, especially since it went nuts randomly without a particular reason.

Does anyone have an idea of what could be the problem and how to fix it?

Any help would be appreciated!

Thanks!

Hello! So, I was working on a new blog on which I'm using the Rubik font from Google fonts. Everything was fine for several days, but today, after working for some time on it, the font just got messed up randomly (see attached image). I added the font on a different, testing site and it shows messed up there as well, so it's not something website related. Now, the shocking part is that it gets messed up only on Mozilla and only on the Mozilla browser that's on my Desktop PC. I asked a friend to check it out and I also checked it out on my laptop, and the font is fine on other Mozilla browsers, as well as other browsers. Other fonts from other websites are fine as well. What troubleshooting I performed: - Checked the font with Inspect Element, as it's shown here: https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Edit_fonts and the font is set up correctly; - Deleted the whole history since the beginning of time (cookies, cache, everything); - Closed and opened Firefox again; - Opened Mozilla in Safe Mode (hardware acceleration is disabled by default in safe mode); - Restarted my PC; - Uninstalled Mozilla as it shows here - https://support.mozilla.org/en-US/kb/uninstall-firefox-from-your-computer. Deleted the profile folder and everything. - Installed a fresh copy again with no add-ons, no nothing. Nothing worked. That font is still messed up on Mozilla, on this PC. It doesn't make any sense, especially since it went nuts randomly without a particular reason. Does anyone have an idea of what could be the problem and how to fix it? Any help would be appreciated! Thanks!
Attached screenshots

Réiteach roghnaithe

Running out of guesses... Is it possible this PC has a locally installed copy of Rubik in the Windows font folder that Firefox might be using instead of the downloadable version??

Read this answer in context 👍 1

All Replies (20)

more options

What strikes me about the Firefox side of your screenshot is that letters look a bit "squashed" vertically. I don't know what could cause that. Do you have a page online that demonstrates the problem?

When I compare Firefox and Chrome on https://fonts.google.com/specimen/Rubik (changing the body text to Rubik), the Chrome rendering is a bit lighter, and the Firefox rendering has the characteristic heavier sub-pixel anti-aliasing. (Comparison attached.) what kind of result do you get on that page?

Firefox uses Windows ClearType for font smoothing, and takes advantage of hardware acceleration for best results. If you see the identical rendering between Firefox's Safe Mode and regular mode, there could be a problem with hardware acceleration not working normally. However, the diagnostic info you shared shows:

  • direct2DEnabled: True
  • directWriteEnabled: True

So I think hardware acceleration is at least running.

Firefox has settings that could affect font rendering you can view in about:config:

(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 or accepting the risk.

(2) In the search box above the list, type or paste font_r and pause while the list is filtered

(3) Preferences with non-default values typically are bolded and show a status of "Modified" -- you can restore the original value using right-click > Reset

more options

Thanks for your fast reply!

#1. I know that fonts can be slightly different on different browsers. I'm well aware of that.

The thing is that I'm not talking about Mozilla vs other browsers. I'm talking about Mozilla on my PC vs Mozilla on other PCs.

In my attached image, it's the font on Mozilla on other PCs and my own before it changed (left) vs Mozilla on my PC now (right), after it got messed up.

It worked fine on my PC until today. It just suddenly changed. That image is basically a before and after.

For example, if I check that font (the Light 300 version) on different websites, on my laptop, using Mozilla, it looks fine, as you can see on my image, on the left.

If I ask a friend to check it out using Mozilla, it looks fine. If you check it out using Mozilla, it will look fine.

That's because the problem seems to only be with the Mozilla browser that's on my desktop PC, not on other devices as well.

That's what makes the issue so strange and senseless. The same font that looks fine on other Mozilla browsers from other devices, looks messed up on my PC.

#2. The diagnostic info I shared is the one from the new, fresh Mozilla installation.

As I mentioned above, I did perform a Safe Mode troubleshooting, which disables hardware acceleration by default. So, that can be excluded.

#3. I checked about:config and everything's set to default.

I literally have no idea what could cause this.

more options

Could you try:

New Profile Test

This takes about 3 minutes, plus the time to test your problem font.

Inside Firefox, type or paste about:profiles in the address bar and press Enter/Return to load it.

Click the Create a New Profile button, then click Next. Assign a name like Nov2018, ignore the option to relocate the profile folder, and click the Finish button.

After creating the profile, scroll down to it and click the Set as default profile button below that profile, then scroll back up and click the Restart normally button. (There are some other buttons, but please ignore them.)

Firefox should exit and then start up using the new profile, which will just look brand new. Please ignore any tabs enticing you to connect to a Sync account or to activate extensions found on your system so we can get a clean test.

Does the font render any differently in the new profile?

When you are done with the experiment, open the about:profiles page again, click the Set as default profile button for your normal profile, then click the Restart normally button to get back to it.

more options

Did it, but there's no change.

I also did this when I troubleshoot the issue since I completely uninstalled Mozilla and deleted the Firefox folder from the AppData folder.

This issue is definitely one for the books.

more options

Réiteach Roghnaithe

Running out of guesses... Is it possible this PC has a locally installed copy of Rubik in the Windows font folder that Firefox might be using instead of the downloadable version??

more options

Does this also happen on the Google website (I'm not sure you confirmed this)?

Did you confirm on the Font tab in the Inspector that Firefox is using the Rubik font?

more options

jscher2000 said

Running out of guesses... Is it possible this PC has a locally installed copy of Rubik in the Windows font folder that Firefox might be using instead of the downloadable version??

That's it! I would have never thought of that! Thank you!

I had the Rubik font installed in Windows as well, to use it in Photoshop for the logo, and for some reason, Firefox decided to use that or create some sort of conflict.

It's very weird because this never happened before, and I always install fonts locally for Photoshop.

I don't know why it decided to do this for this particular font and after several days, not from the start.

Is there a way to prevent this from happening in the future? A setting in Firefox or something?

Thanks again! I appreciate it!

more options

I think that the Font tab in the Inspector would have stated that a local version and not a remote version of the Rubik font was used.

more options

Deleting the local font may be an effective workaround, but I don't know why it stopped working. I imagine something was weird with the metrics, and that caused Firefox to squash it, but I don't know where that information comes from for local vs. downloaded fonts.

more options

cor-el said

I think that the Font tab in the Inspector would have stated that a local version and not a remote version of the Rubik font was used.

I checked that before when it was messed up and now when it's fixed.

Just to be sure, I reinstalled the font locally to mess it up, used Inspect Element again, and it shows the same thing on both cases (see attached).

Perhaps I didn't look in the right spot...

Athraithe ag Radu_B ar

more options

Radu_B said

Perhaps I didn't look in the right spot...

Looks like they moved the path information down into the "All fonts on page" section, which might cause some ambiguities from time to time...

more options

It looks that you currently need to click "all fonts on page" to see more information about the origin of each font (URL or System font).

more options

Yep, I didn't look there, unfortunately.

When I have Rubik installed locally as well, it says "System" in the "All fonts on page" section.

Even if I would have seen it, I'm not sure that the penny would have dropped :).

Thank you!

Athraithe ag Radu_B ar

more options

Thanks for confirming that it is possible to see whether a local or remote font is used.

more options

Maybe the font that was installed locally is an older version.

more options

Could be. I downloaded it from Font Squirrel.

more options

In my experience, local font files typically cause this problem. I've experienced it in both Firefox and Chrome. While browser extensions can solve the problem with varying degree of success, the best solution is to uninstall the offending font file. Typically it's Helvetica or another commonly used font. You can ID the font in question definitively with Inspect Element.

In the future you can install the font briefly when you need it and uninstall it when you're done.

Another possibility is that renaming the font could make it unique enough such that it's not accidentally called by your browser.

more options

I got exactly the same problem;

and Mozilla is now confusing my webfont with Times NEW Roman on system; and system says - you cannot delete System font (Times New Roman); and what should I do now?!

I have several sub-sites with exactly the same configuration, and there fonts are working correct. Also on this website fonts in Chrome are working correct; but not on Mozilla; and I don't like Chrome, use it only for testing....

more options

Is your webfont named similarly to Times New Roman? You should rule out a naming issue.

Then you should test other machines and browsers. Then try a clean Firefox Portable install / disable all your extensions. If that works, then extensions are the problem and you need to renable them one-by-one.

more options

Hi zambala, it sounds as though there must be some difference between your sites if Firefox works correctly on most of them and falls back to the default font only on one of them. Does the Web Console show any message about the font not being loaded for some reason? https://developer.mozilla.org/docs/Tools/Web_Console