views:

93

answers:

2

I've been developing a site that uses the Google Fonts API. It's great, and supposedly has been tested in IE, but when testing in IE 8 the fonts simply don't get styled.

I included the font, as Google instructs, thus:

<link href="http://fonts.googleapis.com/css?family=Josefin+Sans+Std+Light"  
 rel="stylesheet" type="text/css" />

and added its name to the front of a font family in CSS thus:

body {
font-family: "Josefin Sans Std Light", "Times New Roman", Times, serif;
font-size: 16px;
overflow-y: scroll;
overflow-x: hidden;
color: #05121F;
}

Works like a charm in Chrome, Firefox, Safari. No dice in IE 8. Anybody know why?

A: 

Are you using HTML 5 doctype? <!DOCTYPE html>

stephenmurdoch
Has absolutely nothing to do with this. The purpose of the `doctype` in HTML 5 is simply to trigger standard layout mode and has nothing to do with Google's Font API working.
Yi Jiang
:) I see. Didn't know this. Thanks Yi.
stephenmurdoch
+3  A: 

The method, as indicated by their technical considerations page, is correct - so you're definitely not doing anything wrong. However, this bug report on Google Code indicate that there is a problem with the fonts Google produced for this, specifically the IE version. This only seems to affect only some fonts, but it's a real bummmer.

The answers on the tread indicate that the problem lies with the files Google's serving up, so there's nothing you can do about it. The author suggest getting the fonts from alternative locations, like FontSquirrel, and serving it locally instead, in which case you might also be interested in sites like the League of Movable Type.

Yi Jiang
+1 for providing (better) alternatives.
Caspar Kleijne
@Yi Jiang, you're right, I'm serving the files locally, with Font Squirrel's more robust [@font-face kit](http://www.fontsquirrel.com/fontface) and it works just fine.
Isaac Lubow