Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
function testFont(name) {
name = name.replace(/['"<>]/g,'');
var body = document.body,
test = document.createElement('div'),
installed = false,
template =
'<b style="display:inline !important; width:auto !important; font:normal 10px/1 \'X\',sans-serif !important">ii</b>'+
'<b style="display:inline !important; width:auto !important; font:normal 10px/1 \'X\',monospace !important">ii</b>',
if (name) {
test.innerHTML = template.replace(/X/g, name); = 'position: absolute; visibility: hidden; display: block !important';
body.insertBefore(test, body.firstChild);
ab = test.getElementsByTagName('b');
installed = ab[0].offsetWidth === ab[1].offsetWidth;
return installed;

Strange, I seem to be getting off by 1px errors testing for HelveticaNeue-CondensedBold on iOS 5, but it works fine on Chrome on OSX.

I increased the font size to 1000px and the sizes are still off by 1px. I changed the character from ii to ww and then the test works fine. Just a heads up, not sure what's going on.


lsmith commented Mar 25, 2012

Meaning the font is installed, but is reporting that it isn't because the two <b>s are reporting different dims?

That's right, that's what seems to be happening, just on iOS 5.

EDIT: I'll see if I can make a reduced test case. It might possibly be something I'm doing in my CSS that messes it up.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment