Chrome 10/Windows @font-face encoding trouble

问题:

Has anyone come across something like this exclusively in Chrome 10/Win?

All the non-breaking spaces in these two webfonts aren't rendered properly. Working in IE7/8/9, Firefox, Safari, and Chrome/OSX.

Contents of my fonts.css file:

@font-face {
    font-family: 'Hellenic';
    src: url('../fonts/eot/hellenic.eot?') format('eot'),
         url('../fonts/ttf/hellenic.ttf') format('truetype'),
         url('../fonts/woff/hellenic.woff') format('woff'), 
         url('../fonts/svg/hellenic.svg#MCMHellenicWide') format('svg');
}

@font-face {
    font-family: 'Lasalle';
    src: url('../fonts/eot/lasalle.eot?') format('eot'),
         url('../fonts/ttf/lasalle.ttf') format('truetype'),
         url('../fonts/woff/lasalle.woff') format('woff'), 
         url('../fonts/svg/lasalle.svg#FilmotypeLaSalle') format('svg');
}

@font-face {
    font-family: 'LeagueGothic';
    src: url('../fonts/eot/leaguegothic.eot?') format('eot'),
         url('../fonts/ttf/leaguegothic.ttf') format('truetype'),
         url('../fonts/woff/leaguegothic.woff') format('woff'), 
         url('../fonts/svg/leaguegothic.svg#svgFontName') format('svg');
}

回答1:

It is highly likely that the webfont is not assembled properly.

I have downloaded CaviarDreams font which is used on Sebastian's site and got the same bug.

Then I downloaded it from here: http://www.dafont.com/caviar-dreams.font, used fontsquirrel.com's typekit generator, and the result was perfectly fine.

回答2:

Try encoding them using fontsquirrel.com Typekit generator I am not sure what the problem is, but it might help.

回答3:

Try this from a previous StackFlow question. Refer to the htaccess part, not the beginning:

font-face with wrong MIME type in Chrome

Also refer to this ticket with Google:

http://code.google.com/p/chromium/issues/detail?id=72727&q=%40font-face&colspec=ID%20Stars%20Pri%20Area%20Feature%20Type%20Status%20Summary%20Modified%20Owner%20Mstone%20OS

Last resort: re-generate your font with Font Squirrel.

回答4:

I commented on this question before and just found some extra information for people having trouble with the boxes and spaces with 'X' for line breaks, end of line and space characters in Chrome, Internet Explorer and Firefox. Yes, sometimes regenerating the font files improves things but then I noticed my problems largely went away when I added unicode characters for spaces and new lines. Paste the following into the Unicode Ranges field on FontSquirrel when generating your fonts:

0085, 000A, 000B, 000C, 000D, 2028, 2029

For good measure I also type a spacebar into the Single Characters field.