Downloadable font on firefox: bad URI or cross-site access not allowed for fonts

When using cool fonts in CSS and the display is off in Firefox, you may find the Error Console declare, “Downloadable font on firefox: bad URI or cross-site access not allowed” as a cause. This simply means that Firefox is trying to improve security for your benefit. Since you control what your pages may access, including content from other domains, such as a devoted font server, you simply modify your .htaccess file as follows.

Place this code somewhere in the .htaccess file, update the server where the fonts are being served, and TEST! Remember that the .htaccess file must be modified on the Font Server, not the Web Server, since Firefox is requiring permission from the Font Server to access those fonts. Technically you can access them in a separate request, so the whole issue seems nutty.

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