Font-face doesn't seem to work in IE8?

I have the following lines in my CSS.

@font-face { font-family: Keffeesatz; src: url(/Styles/YanoneKaffeesatz-Light.otf) format("opentype") } @font-face { font-family: KeffeesatzBold; src: url(/Styles/YanoneKaffeesatz-Bold.otf) format("opentype") } 

In IE9, they are displayed. In IE8, it uses the fallback font Arial. How to make this work in IE8?

+6
source share
2 answers

You need to provide the EOT version of your font so that older versions of IE can embed it. They will not recognize any other format, so you are seeing rollback in Arial.

Take your font into the Font Squirrel @font-face Generator and it will prepare everything for you, including the new CSS @font-face rule set to use your existing ones.

+15
source

Internet Explorer does not recognize your .ttf (TrueType) or .otf (OpenType) font in CSS3, at least not yet. IE recognizes .eot (Embeddable Open Type).

 @font-face { font-family: 'MyWebFont'; src: url('webfont.eot'); /* IE9 Compat Modes */ src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('webfont.woff') format('woff'), /* Modern Browsers */ url('webfont.ttf') format('truetype'), /* Safari, Android, iOS */ url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */ } 

Take a look here

+1
source

Source: https://habr.com/ru/post/909742/


All Articles