Generated font pack doesn't display correctly in Chrome

[mlms13]

Using the generator at icnfnt.com, some characters in the resulting font files don't display correctly in Chrome (tested in 23 and 26.0.1378.2). This is the case with both the WOFF and the TTF files, and it only happens in Chrome. Everything still works correctly in Firefox, IE9, and IE10.

I thought this may be an issue on my end, or an issue with Chrome, but when I replace the generated font files with the original, complete fonts, the symbols display correctly.

I'm attaching a screenshot of an unmodified icon-reference.html. Let me know if I can provide any other information that would be useful.

[mlms13]

Further testing shows that this issue is specific to Chrome on Windows. The same versions of Chrome seem to work fine on Ubuntu 12.04 and OS X 10.8.

[d9media]

Same issue on Opera (Windows).

[grantgordon]

Thanks for reporting the issue, guys!

Quick followup question: does this happen the first time you generate a font, or only after you generate one, go back and change things, and then generate another?

[DotDotJames]

confirmed - same issue - icons downloaded: .icon-search:before { content: "\f002"; } .icon-home:before { content: "\f015"; } .icon-remove-sign:before { content: "\f057"; } .icon-question-sign:before { content: "\f059"; } .icon-info-sign:before { content: "\f05a"; } .icon-random:before { content: "\f074"; }

where these icons weren't rendered properly &/or at all: .icon-search:before { content: "\f002"; } .icon-home:before { content: "\f015"; } .icon-remove-sign:before { content: "\f057"; }

[grantgordon]

I've also confirmed the problem personally, now.

These get 'fi' and 'fl,' respectively: .icon-music .icon-search

These are just blank: .icon-glass .icon-envelope .icon-heart .icon-star .icon-star-empty .icon-user .icon-film .icon-th-large .icon-th .icon-th-list .icon-ok .icon-remove .icon-zoom-in .icon-zoom-out .icon-off .icon-signal .icon-cog .icon-trash .icon-home .icon-file .icon-time .icon-road .icon-download-alt .icon-download .icon-upload .icon-inbox .icon-play-circle .icon-repeat .icon-double-angle-left .icon-double-angle-right .icon-double-angle-up .icon-double-angle-down .icon-angle-left .icon-angle-right .icon-angle-up .icon-angle-down .icon-desktop .icon-laptop .icon-tablet .icon-mobile-phone .icon-circle-blank .icon-quote-left .icon-quote-right .icon-spinner .icon-circle .icon-reply .icon-github-alt .icon-folder-close-alt .icon-folder-open-alt

It must be an issue with the generated woff file. I don't have time to troubleshoot any farther right this minute -- if anyone wants to take a stab at playing with the woff export feel free. I'll try to hit it later.

[grantgordon]

Just upgraded to 3.0.2 and that didn't seem to fix it. Will look into the woff angle.

[grantgordon]

After much plumbing the depths of fontforge I believe I have found a fix. I should have it integrated and deployed in the next day or two.

[grantgordon]

Alrighty! It's pushed and deployed. Care to give it a try and confirm that it's fixed for you?

[tagliala]

Hi,

the issue is fixed, I got all the icon requested in chrome / windows 7 too

but... Icons look different, they are not perfectly antialiased and a little bit bigger (both on chrome and firefox):

pixel perfection is lost :(

Anyway I have a couple of extra question not related to this issue

1. why is the codification different? I mean, in my css I need to use ``content: "\fxxx"`. With a customized set of icons, content is different and this break up things

2. can we have icons sorted by name and a visible name? It's hard to find the icons needed. If there is a name, we can simply CTRL/CMD+F and enter the name

Sorry for my English

[grantgordon]

Ugh. I thought I had that issue fixed. I'll look into it.

The codification changed because whole swaths of the old address blocks were suddenly unusable in chrome for windows after trimming the original font file. Generating new ones seemed to fix the issue for now, but I'll see if I can find a workaround.

[tagliala]

Thanks

btw, about "issue" number 2, for those interested, here is a workaround until we can have a feature to import settings

$("li.selected[data-original-title]").click()
var icons = 'heart star user ok remove cog time list-alt plus-sign question-sign gift warning-sign random bar-chart signout github link copy magic undo exchange'.split(' ');
for (i = 0, l = icons.length; i < l; ++i) { $("li[data-original-title='.icon-" + icons[i] + "']").click() }

just put in icons variable the icons you need (without icon- prefix) space separated and run this script from chrome/firebug console