IE 9 won't render font

[andrewsmd]

I'm importing a custom font like so
@font-face {
font-family: "nexa";
src: url("../fonts/Nexa_Free_Light.otf");
}

When I set the style to nexa, it works in Chrome and FF, but IE 9 goes to my fall back font. Is there a way to import the font so it works in IE too?

[lucy24]

Tangential answer: PLEASE don't use relative links in the ../ form in css. They're undesirable at the best of times; in css you absolutely-- haha --need the site-absolute form with leading / (directory slash). Personally I make an exception when everything is happening within the same directory. Some folks, ahem, naming no names, don't admit the exception.

This is not likely to solve your problem, but try it just to clean away one variable.

Did you pore over the relevant page at caniuse dot com? The line that jumped out at me was

Partial support in IE9 refers to the fonts only working when set to be "installable".

Is your font "installable"? (Is this something you can change? Over on my side of The Great OS Divide, the big variable is "embeddable". And officially you can't change that; it's built into the font.)

I'm also worried by the discovery that rules with ttf and otf don't work at all in MSIE <9. Any earlier and you have to use eot-- which, of course, nobody but MSIE has ever used. Is that what the fallback font is for?

[andrewsmd]

Yes, the fallback font looks somewhat close to that font. I know my link is correct because it works in other browsers. I had set it to the full link just to be sure, to no avail. I had also read IE only uses eot files so I converted it to a EOT file, but that didn't work either.

[lucy24]

Well, that wipes out the "installable" explanation, since it doesn't apply to .eot format.

Obligatory stupid question: When you say "converted to EOT" you mean that you used a suitable font-conversion utility and really changed it, right? Not just put a different extension on the end? I am not trying to insult your intelligence, honest, just covering all possible bases.

Did you fine-tooth-comb it for case matching? This is something you'd want to do in any case, so doing it now isn't a complete waste of time. I know it gives me the willies when I meet a font name using different casings in different places. Most browsers-- or operating systems, or servers-- don't seem to care, but sooner or later there will be one that does. (Why does Opera, specifically, claim I don't have a font that I do have? Can it be pure coincidence that this font writes its name in ALL CAPS?)

[andrewsmd]

Haha, yes, I didn't just change the extension. However, I did just google a ttf to eot converter, so I can't verify it's validity. As far as the case matching, like I said, it does work in FF and chrome so I know it's not that. All I did was change the extension and I put it in the same folder as the other one. I think I'm just SOL