@fontface works on http://www.domain.com but doesn

Question

@fontface works when I load http://www.grozav.com but doesn't work on http://grozav.com .

What can I do to fix this?

 @font-face {
    font-family: Impact;
    font-weight:bold;
    src: url('http://grozav.com/font/impact.ttf');
    src: url('http://www.grozav.com/font/impact.ttf');}

@font-face {
    font-family: MisterGiacco-Bold;
    font-weight:bold;
    src: url('http://grozav.com/font/giacco.ttf');
    src: url('http://www.grozav.com/font/giacco.ttf');}

I tried putting 2 urls. Didn't work. Can someone help me with this?

Answer 1

Why specify the full URL? Just put:

src: url('/font/giacco.ttf');

It might be a case that @fontface doesn't work cross-domain. FireFox has an issue with this.

But if you are using a file from within the same domain, just don't specify the full domain, and just the supply the path to the ttf file.

Answer 2

Definitively it's the url, but why? Apparently @font-face does not care about cross domain issues but firefox do, so in order to make it work with cross domain in firefox you should set your server (apache?) to avoid this restriction for one or multiple domains, the following page has some info about this: http://www.cssbakery.com/2010/07/fixing-firefox-font-face-cross-domain_25.html

I guess the simplest choice is @Curt's choice ;)