Firefox webfonts not loading

Question

I'm having an issue with webfonts only in Firefox, all other browsers (including IE) work perfectly.

My issues is that the webfonts won't load at all.

I've looked at this possible solution, editing the htaccess file (http://www.fontsquirrel.com/blog/2010/11/troubleshooting-font-face-problems) but I've had no luck.

The only other thing that I can say is in Firefox's error console I get the following warning:

Error in parsing value for "src". Skipped to the next declaration.

Here's a sample of my font-face code:

@font-face {
    font-family:AngelinaRegular;
    src:url(../fonts/angelina-webfont.eot);
    src:url(../fonts/angelina-webfont.eot?iefix) format(eot), url(../fonts/angelina-webfont.woff) format(woff), url(../fonts/angelina-webfont.ttf) format(truetype), url(../fonts/angelina-webfont.svg#webfontOvuhCGpN) format(svg);
    font-weight:normal;
    font-style:normal;
}

Any ideas?

Answer 1

In my experience, Firefox is picky about expecting quotes in @font-face rules:

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

Answer 2

There can also be cross domain issues with fonts in Firefox. See: http://www.cssbakery.com/2010/07/fixing-firefox-font-face-cross-domain_25.html