Chrome for Android webfont bug workaround

While testing this site (as of May 2013, the old version of this site) on an Android tablet (Nexus 7), I came across a bug in Chrome for Android. The browser has a “text enlarger” that is supposed to detect when a line of text is too long, and then raise the font size to increase legibility on a mobile device.

However, when it does this, it changes the text to the default Android font, instead of a web-font specified in the CSS. This bug report details the problem; the response is “that’ll hopefully resolve itself at some point in the future”. In the meantime, it seems that the options are:

  1. Give up on specifying custom fonts;
  2. Use a workaround to disable the auto-sizing.

If you pick option 2, one method is described here: set max-height: 1000000px; in the CSS for the elements for which you want to disable the auto-sizing. This seems like a brittle hack, but it works, I guess. Perhaps in the future we can use text-size-adjust (see here).

Posted October 22, 2012 under .