I'm using an @font-face kit created by uploading a couple fonts of mine to fontsquirrel. I'm having problems with Safari and Opera, both of which are downloading the SVG font, but not using it for rendering the page. I took a closer look at the default stylesheet.css that comes with the kit, and the SVG font URLs all have an anchor hash appended to their filenames.


See that the #webfontgFqFRjPN?

I took all these hashes off in the css for my site, and it looks like that's what's causing the problem.


1 answer


I am not sure about the hash tags, but what CSS are you using?

If you are using the Bulletproof @font-face syntax...

@font-face {
  font-family: 'Graublau Web';
  src: url('GraublauWeb.eot');
  src: local('?'),
         url('GraublauWeb.woff') format('woff'), url('GraublauWeb.ttf') format('truetype');

... then be sure that your CSS file is using UTF-8 for encoding, so that the Happy Face character is recognized.

Reference: http://paulirish.com/2009/bulletproof-font-face-implementation-syntax/

Answered over 7 years ago by David Clarke