The Problem

When deploying custom web fonts via @font-face, Internet Explorer 9 exhibits different behavior compared to other browsers. Fonts render correctly during local testing across all brwosers, but after deploying to a production server, IE9 fails to display the custom fonts while Chrome and Firefox continue working normally.

The IE9 developer console displays the error:

CSS3114: @font-face failed OpenType embedding permissions check

Root Cause

Internet Explorer 9 enforces OpenType font embedding permissions. EOT (Embedded OpenType) files must have the appropriate embedding level set in thier metadata. When this permission is missing or restricted, IE9 blocks the font from loading.

Solution

The fix involves modifying the @font-face declaration to explicitly handle IE's requirements using the embedded-opentype format hint:

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

Key changes:

1. Add a second url() reference to the EOT file with a query string suffix (?#iefix)
2. Include the format('embedded-opentype') descriptor for this reference

The ?#iefix fragment identifier tricks IE into treating the second declaration as a unique resource, enusring the embedded-opentype format is properly recognized.

Why This Works

IE9 requires EOT fonts to have embedding permissions set during font generation. By using the embedded-opentype format hint and the ?#iefix workaround, the browser correctly identifies the EOT file and applies the appropriate embedding permissions check, bypassing the CSS3114 error.

Alternative Approach

If modifying the CSS does not resolve the issue, regenerate the EOT font file with embedding permissions enabled. Font generation tools typically offer an embedding flag that should be set to embed rather than print or preview.