CODEWITHSUNDEEP
cssfont-face
Gas
Gas

Reputation: 737

@font-face problems in Internet Explorer 7

I have a problem with the font-squirell generated @font-face code for one of my sites. The font doesn't show up in Internet Explorer 7. With other browsers it works nicely. The address is: http://www.mrsherskin.com

@font-face {
    font-family: 'PFRondaSeven';
    src: url('font/pf_ronda_seven-webfont.eot');
    src: url('font/pf_ronda_seven-webfont.eot?iefix') format('eot'),
         url('font/pf_ronda_seven-webfont.woff') format('woff'),
         url('font/pf_ronda_seven-webfont.ttf') format('truetype'),
         url('font/pf_ronda_seven-webfont.svg#webfont7vFUbybx') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'PFRondaSeven';
    src: url('font/pf_ronda_seven_bold-webfont.eot');
    src: url('font/pf_ronda_seven_bold-webfont.eot?iefix') format('eot'),
         url('font/pf_ronda_seven_bold-webfont.woff') format('woff'),
         url('font/pf_ronda_seven_bold-webfont.ttf') format('truetype'),
         url('font/pf_ronda_seven_bold-webfont.svg#webfont2zOjOL6G') format('svg');
    font-weight: bold;
    font-style: normal;
}

/* basic font-set */

body { font-family: 'PFRondaSeven'; font-size-adjust: 0.62; }

It's strange because I have another site that I made with this method and it works perfectly.

Any help, please? What could be the problem?

Upvotes: 4

Views: 5926

Answers (3)

Zafer Hangül
Zafer Hangül

Reputation: 76

If it works IE9 but not IE7/8, one of the problem might be incorrect format of eot. I have fixed it with "Fontsquirrel, @font-face generator Expert Mode". Check "Protection: WebOnly"

Upvotes: 3

Rich Bradshaw
Rich Bradshaw

Reputation: 73045

Are you making sure the eot file has the correct mimetype?

I usually add this to my .htaccess file (or equivalent on different software)

AddType application/vnd.ms-fontobject eot
AddType font/ttf                      ttf
AddType font/otf                      otf
AddType font/x-woff                   woff

AddType text/x-component .htc

Upvotes: 0

Krimo
Krimo

Reputation: 954

Try this instead :

@font-face {
font-family: 'Avenir';
src: url('avenirl8-webfont.eot');
src: local('☺'), url('avenirl8-webfont.woff') format('woff'), url('avenirl8-webfont.ttf') format('truetype'), url('avenirl8-webfont.svg#webfontIFZXxqn6') format('svg');
font-weight: normal;
font-style: normal;
}

Replacing the font with your own of course and adding a declaration for the bold font too. It should work ;)

Upvotes: 4

Related Questions