Some of you, the one’s who have bothered to visit my actual tumblog and not just lurk on the Dash, may have nothiced that, in firefox, titles and text didn’t display, quite right.

Here’s an example with Firefox on the left, Chrome on the right:

As you can see, firefox clearly has this wrong.

Anyway, after much investigation, I found out this is caused by “access-control-headers”. Apparently Firefox doesn’t allow sites to use font files hosted elsewhere, via the @font-face css attribute, unless said host specifically allows you to do so. So with no ability to host files on tumblr I’ve had them hosted over at dev.shanerounce.com, in the same folder as my theme’s CSS.

To give firefox proper access to these font files, for cross browser bliss, I simply had to add this snippet of code to a .htaccess file in the folder where I’d been hosting the font files:

<FilesMatch “.(ttf|otf)$”>

<IfModule mod_headers.c>

Header set Access-Control-Allow-Origin “*”

</IfModule>

</FilesMatch>

Using this I’ve now managed to “force” the correct access-controls and allow Firefox to correctly access and display the fonts:

Unfortunately, this was the highlight of my day.

Click here to View this Post on Forrst