'CSS Font Face not working in Firefox or IE8

My font-face is not working in Firefox or IE8.

The files are in the correct sport, here is my css code:

@font-face {
                font-family: 'SnellRoundhand-Script';
                src: url('snellroundhandscript.eot');
                src: url('snellroundhandscript.eot?#iefix') format('embedded-opentype'),
                         url('snellroundhandscript.woff') format('woff'),
                         url('snellroundhandscript.ttf') format('truetype'),
                         url('snellroundhandscript.svg#snellroundhandscript') format('svg');
                font-weight: normal;
                font-style: normal;
        }

Could the files be broken? or is there something wrong with my CSS?

I also have this code below that code:

@font-face {
                font-family: 'Zapfino';
                src: url('Zapfino.eot');
                src: url('Zapfino.eot?#iefix') format('embedded-opentype'),
                         url('Zapfino.woff') format('woff'),
                         url('Zapfino.ttf') format('truetype'),
                         url('Zapfino.svg#Zapfino') format('svg');
                
                         
                font-weight: normal;
                font-style: normal;
        }

You can view my issues here: http://hearingaidneeds.com/

cssfirefoxinternet-explorer-8font-face


Solution 1:[1]

Looks like your .eot file is corrupted for IE and I see no logical reason why FF shouldn't work. Try using this font face creator instead.

Solution 2:[2]

The reason Firefox doesn't work is that your WOFF files are not valid WOFF files. It's worth looking at the web console, which will tell you these things. Mine says, on your site:

[00:07:47.442] downloadable font: table 'cmap': failed to parse table (font-family: "SnellRoundhand-Script" style:normal weight:normal stretch:normal src index:1)
source: http://hearingaidneeds.com/wp-content/themes/twentyeleven/snellroundhandscript.woff @ http://hearingaidneeds.com/wp-content/themes/twentyeleven/style.css
[00:07:47.442] downloadable font: rejected by sanitizer (font-family: "SnellRoundhand-Script" style:normal weight:normal stretch:normal src index:1)
source: http://hearingaidneeds.com/wp-content/themes/twentyeleven/snellroundhandscript.woff @ http://hearingaidneeds.com/wp-content/themes/twentyeleven/style.css
[00:07:47.613] downloadable font: table 'cmap': failed to parse table (font-family: "SnellRoundhand-Script" style:normal weight:normal stretch:normal src index:2)
source: http://hearingaidneeds.com/wp-content/themes/twentyeleven/snellroundhandscript.ttf @ http://hearingaidneeds.com/wp-content/themes/twentyeleven/style.css
[00:07:47.613] downloadable font: rejected by sanitizer (font-family: "SnellRoundhand-Script" style:normal weight:normal stretch:normal src index:2)
source: http://hearingaidneeds.com/wp-content/themes/twentyeleven/snellroundhandscript.ttf @ http://hearingaidneeds.com/wp-content/themes/twentyeleven/style.css
[00:07:47.613] downloadable font: no supported format found (font-family: "SnellRoundhand-Script" style:normal weight:normal stretch:normal src index:4)
source: (end of source list) @ http://hearingaidneeds.com/wp-content/themes/twentyeleven/style.css

Solution 3:[3]

I get this error when I try and upload it on font-squirrel. So much like djthoms said, your file is corrupted.

The page at www.fontsquirrel.com says:

The font 'snell_roundhand_script.ttf' is corrupt and cannot be converted.

Solution 4:[4]

Try using Font2Web, this will converts your font and also create css file and a demo HTML file to show you how to use webfonts on your website - using CSS @font-face

Solution 5:[5]

The font files can be corrupt, and probably are. This is not uncommon when using illegal copies of fonts. Contact Linotype, the copyright holder, or its resellers in matters of using their fonts like Snell Roundhand and Zapfino.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 djthoms
Solution 2 Boris Zbarsky
Solution 3 Black Bird
Solution 4 Rakesh Vadnal
Solution 5 Jukka K. Korpela

Related Questions