IE9 @font-face blues

Question

So IE9 spits out an error on using a google fonts include like the following:

<link href="https://fonts.googleapis.com/css?family=Lato:300,400,700,900" rel="stylesheet" type="text/css" />

IE9 spits out an error, even though the fonts still load fine:

CSS3111: @font-face encountered unknown error. 

I'd gladly ignore this error if I weren't writing content that is iframed on other people's webpages. :(

Hosting the EOT files locally resolves the issue for IE:

< !--[if IE 9]>
< link rel="stylesheet" href="/survey/css/lato-ie.css" type="text/css" />
< ![endif]-->

And in that file..

@font-face {
    font-family: "Lato";
    font-style: normal;
    font-weight: 400;
    src: url("/Lato-Reg-webfont.eot") format("embedded-opentype");
}
@font-face {
    font-family: "Lato";
    font-style: normal;
    font-weight: 900;
    src: url("/Lato-Bla-webfont.eot") format("embedded-opentype");
}

Include it in IE9, error's gone, works great.

Now my problem is, I need to include the google font stylesheet for everyone but IE9. For example, I can't do:

< !--[if !IE 9]>
< link href="https://fonts.googleapis.com/css?family=Lato:300,400,700,900" rel="stylesheet" type="text/css" />
< ![endif]-->

Or firefox won't even see the damn include.

Are IE's devs conspiring to waste all of our time?

Answer 1

你是在正确的轨道上，你只需要使用一个下层揭示的条件评论 ：它将隐藏它从IE，但将被其他浏览器选中。

Answer 2

One question, are you trying to view your files locally?

The google fonts doesnt render locally, even thou they are linked to absolute outside links. (In case of IEs)

localhost/project/index.html = good
C:\Project\index.html = bad