Chrome 3 Has Issue With @font-face and letter-spacing.

jake on 2009.12.01
at 12:20 pm

While working on a friend’s wedding web site an oddity in Chrome’s handling of @font-face came to light. Paul Irish’s code works wonders for enabling the inclusion of alternative typefaces across browsers. Using Goudy Bookletter 1911 on a production site is exciting. But the navigation breaks when I load up my site in Chrome 3 at work.

As you can see here, the letter spacing of .2em is not applied to the typeface.

But as soon as I remove the “Goudy Bookletter” declaration from the CSS it magically starts working.

A search through Google produces nothing relevant so I thought I’d document the problem here. Considering this does not affect the latest version of Safari I have no problem waiting for the fix to work its way into Chrome.

Update: Just to clarify, Chrome 4 fixes this issue.

Posted in: Design · Web