Firefox supports TrueType fonts (.ttf) as well as OpenType fonts with TrueType (.ttf) or PostScript (.otf) outlines.
Same-origin rule: 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.

Firefox supports the .woff format. You can upload your fonts to Font Squirrel and it will generate a css stack and the right font formats to work in all browsers.

I use TypeFront which is like a CDN just for fonts. You upload your ttf or otf font and it generates the css for you to serve fonts from their servers. It’s only $5 a month and works great with W3 Total Cache.

@fredericktownes Notice that fonts show correct in IE and Chrome. All files are uploaded to CDN. Also in W3 total cache cdn config I have entered all extensions of my fonts. The problem is with the browser. I decided to post here in case somebody else noticed the same.

@c3mdigital I already used Font Squirrel to generate code and font files. I have followed your suggestion and used TypeFront and although it has taken more than a day to work, now fonts are correctly displayed in Firefox.

I hope this will be solved in future Firefox updates. Using so much different services is really confusing and not practical.

Wow. Even my boss thought I was nuts when I mentioned this problem to him.

I did a bit of research and as it seems, firefox doesn’t allow you to load fonts from another domain (or even if you provide a full path in the css file).
I doubt if firefox will resolve this “problem” in future updates, as its a security feature. Only sites which have access to the resource will be able to access the font file, specified by the Access-Control-Allow-Origin directive.

Now, our problem is that we are hosting our font files on a CDN (amazon here), and the domain is different from site.

And .htaccess won’t work to add headers to the response from amazon s3.

Solution: I have nothing yet, but I am thinking of pulling the font files off the CDN

@munim2020 I wrestled with this for about 2 and half weeks on my own – reading up on this issue (very few people are talking about this in terms of deploying from a CDN), and tried two different CDN products (Rackspace cloudfiles and Voxel VoxCast.)

One very important thing is you need to use a CDN product that allows you to manually customize Apache mod_header directives or uses the directives from the origin server when it fetches the files it’s mirroring on the remote hosting network. (This is a cool feature because you have only one place to check for errors.)

Recently, I went back and forth with all their tech support departments and finally it came down to 4 or 5 things…The last guy broke it down like this…

All of these things can go wrong:

1. How Firefox was dealing with Expires headers while you’re during your fixes (holding on to old data)

2. Time to live (TTL) for the data on the CDN (your CDN is holding on to old data) Even if you upload new data to the CDN depending on how it works you still have to wait until the old data expires to see the new data propagate properly across the entire CDN node network)

3. Some misconfiguration of the .htaccess files or http.conf (I had a mixture of dos and apache formatting on some of my directives, my host support staff helped me clean up my file – this was breaking the CSS reference/permissions to the font files in firefox.)

4. Making sure files paths are correct and that origin and remote host see each other (you can check this in firebug)

5. Also if you throw cnames in the mix, you could be dealing with DNS propagation issues.

We also did a minor incremental update to PHP for good measure.

Needless to say this can test your patience. If all of these things are out of sync, NO fonts for you. I seem to be up and running now.

just use absolute paths in the @font-face css to the font files hosted on your own domain, you can use http://www.fontsquirrel.com/fontface/generator to gnerate all necessary fonts thus avoiding having to access fonts externally via CDN or other services which will throw up issues with firefox

this finally worked – I couldn’t get any difference from using relative links in firefox – I found this code on someone’s site, but don’t have the link sorry – but it does work. I use a number of different fontfaces from this same neue family all generated at font squirrel – so I needed to replicate this snippet for each one.

fyi when I was using php pages without wordpress the absoulute link worked fine for firefox.

I’ve actually only tested this in the latest ff, chrome and ie – haven’t even installed safari / opera yet – just got a new puter last week at the same time I was changing over to wp. cheers, hope this works for someone,. B