Reputation: 57
I am using the following font-face rule:
@font-face {
font-family: aiCustomFont;
src: url('../fonts/myriadpro-regular.otf') format('opentype'),
url('../fonts/myriad pro regular.ttf') format('truetype');
}
This works exactly as expected for Safari, Chrome, and Firefox. It does not work at all for IE11 and Edge. I am not seeing any errors logging to the console or anywhere else. I have found many articles on font issues in IE but most of them are several years old.
Do I still need different font formats outside of TTF/OTF for the font to display in IE11/Edge?
Upvotes: 0
Views: 2119
Reputation: 57
If anyone stumbles across this post, I ended up just using a more web-friendly font.
Make sure your @font-face rules are NOT contained in media queries. @font-face rules contained in media queries do not work in IE, Edge, but work in every other modern browser I tested on.
Upvotes: 1