Die Funktionalität dieser Website ist durch Wartungsarbeiten eingeschränkt, die Ihr Erlebnis verbessern sollen. Wenn ein Artikel Ihr Problem nicht löst und Sie eine Frage stellen möchten, können Sie unsere Gemeinschaft über @FirefoxSupport auf Twitter, /r/firefox oder Reddit fragen.

Hilfe durchsuchen

Vorsicht vor Support-Betrug: Wir fordern Sie niemals auf, eine Telefonnummer anzurufen, eine SMS an eine Telefonnummer zu senden oder persönliche Daten preiszugeben. Bitte melden Sie verdächtige Aktivitäten über die Funktion „Missbrauch melden“.

Weitere Informationen

Font files not displayed, but loaded correctly.

  • 3 Antworten
  • 1 hat dieses Problem
  • 7 Aufrufe
  • Letzte Antwort von lucid_j

more options

Hi there

I am loading two font files and I am working on a website using vue.js and nuxt.js. The @fontface rules look like this:

``` @font-face {

 font-family: 'PatronWEB';
 font-style: normal;
 font-weight: normal;
 src: url('/static/fonts/PatronWEB-Regular.woff') format('woff');
 src: url('/static/fonts/PatronWEB-Regular.woff2') format('woff2');

}

@font-face {

 font-family: 'PatronWEB-Italic';
 font-style: italic;
 font-weight: normal;
 src: url('/static/fonts/PatronWEB-Italic.woff') format('woff');
 src: url('/static/fonts/PatronWEB-Italic.woff2') format('woff2');

} ```

Everything works fine, but sometimes in Firefox (Dev Edition and Standard Edition) the whole page appears white. After a long session of debugging I realized that the text is actually there, but it cannot be displayed because the fontfile is kind of «empty».

If I check the network tab I can see that the fontfiles were loaded correctly. If I hover the preview for the font in the css inspector, I don't see no preview. Which is really strange. So the browser thinks he has the font, but actually does not. So it would not even fallback to another font defined in the css rule.

Maybe it has also something to do with Hot module reloads, but in Chrome everything works fine, so I think it could be a firefox issue,

Please also check my attached files. I hope someone can help me with this.

Cheers J

Hi there I am loading two font files and I am working on a website using vue.js and nuxt.js. The @fontface rules look like this: ``` @font-face { font-family: 'PatronWEB'; font-style: normal; font-weight: normal; src: url('/static/fonts/PatronWEB-Regular.woff') format('woff'); src: url('/static/fonts/PatronWEB-Regular.woff2') format('woff2'); } @font-face { font-family: 'PatronWEB-Italic'; font-style: italic; font-weight: normal; src: url('/static/fonts/PatronWEB-Italic.woff') format('woff'); src: url('/static/fonts/PatronWEB-Italic.woff2') format('woff2'); } ``` Everything works fine, but sometimes in Firefox (Dev Edition and Standard Edition) the whole page appears white. After a long session of debugging I realized that the text is actually there, but it cannot be displayed because the fontfile is kind of «empty». If I check the network tab I can see that the fontfiles were loaded correctly. If I hover the preview for the font in the css inspector, I don't see no preview. Which is really strange. So the browser thinks he has the font, but actually does not. So it would not even fallback to another font defined in the css rule. Maybe it has also something to do with Hot module reloads, but in Chrome everything works fine, so I think it could be a firefox issue, Please also check my attached files. I hope someone can help me with this. Cheers J
Angefügte Screenshots

Geändert am von lucid_j

Alle Antworten (3)

more options

Separate security issue : please update your Flash 27.0 r0 Flash Player Version: 29.0.0.171 Current Version https://get.adobe.com/flashplayer/otherversions/ Step 1: Select Operating System Step 2: Select A Version (Firefox, . . . .) Note: Other software is offered in the download. <Windows Only>

Please supply the URL if there is a live page.

Please check your code in case that is the issue, W3C upload or URL

more options

Do you have any of the fonts installed locally?

Maybe do a check for sandbox security issues

You can set this pref to 2 or 1 on the about:config page to reduce the sandbox security level.

  • security.sandbox.content.level = 1
  • close and restart Firefox to make the change effective.

If '1' still doesn't have effect then try '0' to disable the sandbox.

If this didn't work then undo/reverse the change and reset the pref via the right-click context menu to the default value.

You can open the about:config page via the location/address bar. You can accept the warning and click "I accept the risk!" to continue.

more options

No I just use the woff files, no local installation of the font.

I also tried the sandbox levels 1 and 0. Nothing helped. I also have to mention that: 1. At the beginning – just for a blink of an eye, I can see all the text. Then it disappears. So I guess first – before the font is loaded I see some fallback font, like Arial, then as soon as the browser thinks it got the fontfile, I see blank. 2. If I build and deploy everything is fine. Just in dev mode, when developing locally (with some browser sync and component injection via nuxt) I get the blank page. 3. It is not only on my computer. The same repository on another machine will cause the same issue in firefox..