Fonts generated with Font Squirrel do not display in IE 9

font-faceinternet-explorer-9

I have used the Fontsquirrel @fontface Generator to create the CSS for the three fonts I am using. The fonts are displaying properly in every browser including other versions of IE — but IE 9 is not displaying the fonts.

Here is the CSS:

    @font-face {
    font-family: "OswaldBold";
    src: url("../fonts/oswald-bold-webfont.eot");
    src: url("../fonts/oswald-bold-webfont.eot?#iefix") format("embedded-opentype"),
         url("../fonts/oswald-bold-webfont.woff") format("woff"),
         url("../fonts/oswald-bold-webfont.ttf") format("truetype"),
         url("../fonts/oswald-bold-webfont.svg#OswaldBold") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "OswaldRegular";
    src: url("../fonts/oswald-regular-webfont.eot");
    src: url("../fonts/oswald-regular-webfont.eot?#iefix") format("embedded-opentype"),
         url("../fonts/oswald-regular-webfont.woff") format("woff"),
         url("../fonts/oswald-regular-webfont.ttf") format("truetype"),
         url("../fonts/oswald-regular-webfont.svg#OswaldRegular") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "OswaldLight";
    src: url("../fonts/oswald-light-webfont.eot");
    src: url("../fonts/oswald-light-webfont.eot?#iefix") format("embedded-opentype"),
         url("../fonts/oswald-light-webfont.woff") format("woff"),
         url("../fonts/oswald-light-webfont.ttf") format("truetype"),
         url("../fonts/oswald-light-webfont.svg#OswaldLight") format("svg");
    font-weight: normal;
    font-style: normal;
}

…and here are the errors I am getting in the IE developer console:

CSS3111: @font-face encountered unknown error.
oswald-light-webfont.eot?#iefix

CSS3111: @font-face encountered unknown error.
oswald-bold-webfont.eot?#iefix

CSS3111: @font-face encountered unknown error.
oswald-light-webfont.woff

CSS3111: @font-face encountered unknown error.
oswald-bold-webfont.woff

CSS3114: @font-face failed OpenType embedding permission check. Permission must be Installable.
oswald-light-webfont.ttf

CSS3114: @font-face failed OpenType embedding permission check. Permission must be Installable.
oswald-bold-webfont.ttf

I haven't had any luck with the searches I've done, any insight would be much appreciated. Thank you in advance.

Best Answer

I fixed the problem by generating the font files again using the Font Squirrel generator.

I selected the 'expert' control option and changed from 'EOT Compressed' to 'EOT Lite'

The fonts now work in every browser.

enter image description here

Related Topic