Font awesome not working in Firefox

Question

I\'m using bootstrap and I added font awesome through Less, overriding the Glyphicons. The icons display OK in chrome but in Firefox i just see boxes.

This is how my

Answer 1

Custom web fonts via CDN (or any cross-domain font request) doesn't work in Firefox or Internet Explorer (correctly so, by spec) though they do work (incorrectly so) in Webkit-based browsers.

You can fix this by adding headers to your page.

Apache

    Header set Access-Control-Allow-Origin "*"

Nginx

if ($filename ~* ^.*?\.(eot)|(ttf)|(woff)$){
    add_header Access-Control-Allow-Origin *;
}

Credit: http://davidwalsh.name/cdn-fonts