Firefox cannot load @font-face?

Question

Possible Duplicate:
@font-face fonts only work on their own domain

I've been working on my blog template and i'm using @font-face, but it seems that the fonts doesn't load in Firefox. But it does on Chrome, IE, Safari

Here's the @font-face that i used

@font-face {
    font-family: 'BebasNeueRegular';
    src: url('https://sites.google.com/site/directorybesttheme/font/BebasNeue-webfont.eot');
    src: url('https://sites.google.com/site/directorybesttheme/font/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
         url('https://sites.google.com/site/directorybesttheme/font/BebasNeue-webfont.woff') format('woff'),
         url('https://sites.google.com/site/directorybesttheme/font/BebasNeue-webfont.ttf') format('truetype'),
         url('https://sites.google.com/site/directorybesttheme/font/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

Any idea why and how to fix?

score 1 · Answer 1 · edited May 23 '17 at 12:21

Similar questions:

By default, Firefox will only accept relative links. If you want to use absolute links or include fonts from different domains, you need to send these fonts with Access Control Headers - https://developer.mozilla.org/En/HTTP_Access_Control

score 0 · Answer 2 · edited Oct 21 '12 at 11:55

@font-face {
    font-family: 'BebasNeueRegular';
    src: url('./font/BebasNeue-webfont.eot');
    src: url('./font/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
         url('./font/BebasNeue-webfont.woff') format('woff'),
         url('./font/BebasNeue-webfont.ttf') format('truetype'),
         url('./font/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

I was using that code and it works. Don't forget to upload the fontkit to your font folder.

Firefox cannot load @font-face?

2 Answers2