cssfirefoxwebfontsfontello

Fontello Glyph Font odd behaviour on Firefox, shows unicode codes instead of icons


I have a webpage. In its upper right corner I have some social icons. It shows okay in Chrome (both local and on the webserver), it shows ok in local FF, but on the online page I see the square placeholders with the Unicode codes inside.

Oddly enough, if i open Firebug and correct the fontello.css on the fly via Source Edit, the icons appear magically, or so it seems, and this even with trivial corrections like adding and then removing a whitespace.

This is really puzzling me. Any suggestions?


Solution

  • I've managed to solve this strange issue. Turned out it was an Apache problem, got the solution from: http://www.fontsquirrel.com/blog/2010/11/troubleshooting-font-face-problems

    I've added to my .htaccess the following lines:

    If you are serving from Apache, you can add this to your .htaccess file to allow your site access to the fonts:

    <FilesMatch "\.(ttf|otf|woff)$">
    <IfModule mod_headers.c>
            Header set Access-Control-Allow-Origin "*"
    </IfModule>
    </FilesMatch>
    

    and the font now is ok.