This little number was one that Michael and I encountered while we were building Owlr. We store Owlr’s assets — that’s the images, CSS and JS powering it — on a subdomain of Owlr (a.owlr.me). During testing, it was discovered that Firefox didn’t manage to get the web fonts we were using to display icons. At first we dismissed it, since we were aiming Owlr at mobile devices rather than desktops. But, Michael was a stubborn sod about it, so we did some digging around.
It turns out that fonts served from an alternative domain won’t be served for Firefox because of security issues. To get around it, you need to serve the fonts from their origin server with an
Access-Control-Allow-Origin. This is as easy as adding it to the
.htaccess for the same directory as the fonts. Here’s the code:
#This line will only allow access from http://foo.example Access-Control-Allow-Origin: http://foo.example #Whereas this line will allow access from any domain Access-Control-Allow-Origin: *
There’s a little bit more information about this over in Mozilla’s documentation.