11

Update this is no longer reproducible, thanks to everyone who has helped.

All browsers I have tried display SO code blocks using a monospace font, except the Chrome version for Android phones. The latter renders code in the same proportional font as the rest of the text.

SO code blocks are formatted with <code> and/or <pre> HTML tags which Chrome/Android elects to display with a proportional font. These probably have some kind of custom CSS associated with them that sets the background colour and whatnot.

Should that piece of CSS be extended to enforce a monospaced font?

On the one hand, details of how things are displayed are ultimately decided by the browser. On the other hand, people format code for this site expecting it to be rendered in monospace, and a fairly major browser/platform breaks their expectations.

Update This only happens with the mobile version of the site.

The desktop version is rendered in monospace where needed (and with syntax highlighting):

7
  • 3
    Which Chrome and Android versions? I just tried pulling up a random question on my phone and got monospaced font
    – Dennis Meng
    Commented Jun 11, 2014 at 8:22
  • Chrome 35.0.1916.141 Android 4.4.3 on Nexus 5 (this was the case for quite a few versions).
    – n. m. could be an AI
    Commented Jun 11, 2014 at 8:33
  • 1
    Android only comes with a few built-in fonts, so monospaced font doesnot render properly in Android Chrome Browser, except for the phones in which it is provided by the OEM. It's an open issue in Android. And SO has an answer for it too, though it's not good quality.
    – Infinite Recursion
    Commented Jun 11, 2014 at 10:41
  • 1
    @Payeli The very same Chrome browser on the very same phone renders the desktop version of the very same SO site with monospaced fonts where needed. Other browsers on the same phone also display monospaced fonts.
    – n. m. could be an AI
    Commented Jun 11, 2014 at 10:58
  • @Payelli I'm also not sure how the linked issue is relevant here. Scroll down that page and find this: "I'm not sure if Android Browser is still being worked on. Chrome for Android handles it correctly".
    – n. m. could be an AI
    Commented Jun 11, 2014 at 11:20
  • 1
    My bad. As you mentioned, css problem. The font-family for the mobile site needs more fallback fonts.
    – Infinite Recursion
    Commented Jun 11, 2014 at 11:59
  • @n.m. Okay, I'm using those too. After your update, I tried the mobile version of the site (and sure enough, it's not monospace)
    – Dennis Meng
    Commented Jun 11, 2014 at 17:16

1 Answer 1

Reset to default
2

n.m. is right.. the Nexus 5 doesn't render the font as monospaced, I've added a screenshot from my Nexus 5 to provide an example:

Nexus 5 Chrome monospaced font example

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .