title: Firefox Cross-Site Access Error for Fonts
body: <p>We just started using Amazon Cloudfront's CDN to load our files and we are having trouble getting the @font-face fonts to load in Firefox.  Per some recommendations, we added the following code to our htaccess file, but it doesn't seem to solve the problem.</p>
  
  <pre><code>&lt;FilesMatch "\.(ttf|ttc|otf|eot|woff)$"&gt;
    &lt;IfModule mod_headers.c&gt;
      Header set Access-Control-Allow-Origin "*"
    &lt;/IfModule&gt;
  &lt;/FilesMatch&gt;
  </code></pre>
  
  <p>The fonts do show up sometimes, but we still see errors in the console for each font.  You can check it out at <a href="http://wiredimpact.com" rel="nofollow">http://wiredimpact.com</a>.</p>
  
  <p>Also, the main WordPress post I used to learn about this is <a href="http://wordpress.org/support/topic/plugin-w3-total-cache-font-face-not-working-in-firefox?replies=21" rel="nofollow">http://wordpress.org/support/topic/plugin-w3-total-cache-font-face-not-working-in-firefox?replies=21</a>.</p>
  
  <p>Any suggestions on how to get the fonts to load in Firefox correctly?</p>
  
  <p>Thanks.</p>
  
  <p><strong>Edit:</strong></p>
  
  <p>I adjusted the code used in htaccess to:</p>
  
  <pre><code>&lt;FilesMatch "\.(ttf|ttc|otf|eot|woff|font.css)$"&gt;
    &lt;IfModule mod_headers.c&gt;
      Header set Access-Control-Allow-Origin "*.wiredimpact.com"
    &lt;/IfModule&gt;
  &lt;/FilesMatch&gt;
  </code></pre>
  
  <p>This not only adds the font.css file, which seems to help in Firefox, but it also only loads from our subdomains, which is better for security purposes.  The fonts seem to be loading now in Firefox, but the errors are still showing up in the console.</p>