Icons not rendering on certain pages

[Mark Caron]

I'm working with a large enterprise site that encompasses several different applications in one website/domain. Many written in Java, PHP/Drupal, etc. The issue is that on some applications (sections of the site) the icons do not display properly in Firefox (only), while on the rest of the site they display fine.

I'm using Firefox 23.0.1, but the problem has been raised on other versions as well.

The belief was that since these are separate apps all pulling in the same "chrome" (or skin) from the main app, that the changes in subdomain could be posing the problem.

For example: the main app (skin) is at www.company.com, and the app not displaying the icons is at appx.company.com. I had read somewhere that Firefox has issues with this sort of cross-domain stuff. So, we tried adding this to the .htaccess file:

<LocationMatch "/www.redhat.com/avalon/.*\.(ttf|otf|eot|woff|svg)$">
    <IfModule mod_headers.c>
        Header set Access-Control-Allow-Origin "*"
    </IfModule>
</LocationMatch>

It's still not working. Do you have any ideas?

Thanks!

[Keyamoon]

Try this:

<FilesMatch "\.(ttf|ttc|otf|eot|woff|font.css)$">

    <IfModule mod_headers.c>

        Header set Access-Control-Allow-Origin "http://where-fonts-are.com"

    </IfModule>

</FilesMatch>

And check the console to see if there are any errors.