How to make this Google Font work on Internet Explorer 11
Asked Answered
R

1

9

I use Montserrat font on my website, but it doesn't display on IE11 (windows 7). I put this other question some days ago: Montserrat font isn't displayed on IE 10 and 11

Now i am trying to add Montserrat google font throught the css but it doesn't seems to work. This is my code:

@font-face {
    font-family: 'Montserrat';
    src: url('assets/fonts/montserrat-regular-webfont.eot');
    src: url('assets/fonts/montserrat-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('assets/fonts/montserrat-regular-webfont.woff2') format('woff2'),
         url('assets/fonts/montserrat-regular-webfont.woff') format('woff'),
         url('assets/fonts/montserrat-regular-webfont.ttf') format('truetype'),
         url('assets/fonts/montserrat-regular-webfont.svg#montserratregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
Rhodie answered 4/11, 2014 at 9:36 Comment(3)
possible duplicate of Montserrat font isn't displayed on IE 10 and 11Artistic
I comment that on the question, I create the question you refer, but now I am trying to do what the question answer said and I have problemsRhodie
I know, but I couldn't see any difference in your questions. Apologies if I missed something..Artistic
S
10

Use:

@import url(http://fonts.googleapis.com/css?family=Montserrat:400,700);

To call it inside your stylesheet and:

font-family: 'Montserrat', sans-serif;

To make something that font..

From google fonts: "Note: For best display in IE, make the stylesheet tag the first element in the HTML section. In IE, if the link is placed after tags, the entire page will block and not display anything until the font is loaded."

<link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>

If that does not work, try this: https://developers.google.com/fonts/docs/webfont_loader#Example

This will make every browser "behave like Firefox".

Stetson answered 4/11, 2014 at 9:40 Comment(2)
@Genethic see updated answer :) If that does not work, try this: developers.google.com/fonts/docs/webfont_loader#ExampleStetson
@Genethic did the example given by Deer-Outdoor.nl solve your problem?Acorn

© 2022 - 2024 — McMap. All rights reserved.