How to make @font-face compatible in Internet Explorer?

Question

Im trying to get my font to be compatible with Internet Explorer. My font works in all browsers except IE. I know that .ttf and .otf files are not compatible with IE, however I thought .eot files were. Ive looked at similar situations but I can't seem to understand the problem. My current code looks like:

@font-face {
    font-family: Gotham;
    src: url('../Gotham-Book.eot') format('embedded-opentype'),
    url('../Gotham-Book.ttf') format('truetype');
}

The .ttf file works fine (what is working on all other browsers), so I don't believe it is the pathing of the files.

I have purchased this font and have the license.

score 0 · Answer 1 · answered Feb 21 '19 at 17:15

Use below codes:

@font-face{ /* for IE */
    font-family:FishyFont;
    src:url(fishy.eot);
}
@font-face { /* for non-IE */
    font-family:FishyFont;
    src:url(http://....) format("No-IE-404"),url(fishy.ttf) format("truetype");
}

From: CSS @font-face not working in ie

How to make @font-face compatible in Internet Explorer?

1 Answers1