Seehttps://twitter.com/sadhlife/status/1446060335979397120 for the sleuthing :)

Good work! As it happens, this is fixed in the upcoming Chrome 96:python/pythondotorg#1708 (comment)

Oh this kind of bugs … ☹

Thanks@tusharsadhwani and@nedbat!

I released it as python-docs-theme 2021-11 (I live in the future) and rebuilthttps://docs.python.org/3/ so someone can check. Rebuild for other versions and languages will be automatically done in the next 24h.

This "fix" broke the font for me. My Chrome on my Mac is now loading Helvetica for code rather than Courier. I can confirm that removing the quotes frommonospace fixes the issue for me. I recommend this change be reverted and wait for a Chrome mobile fix. Let me know if I need to create a PR.

Chrome, showing 3 different behaviours on 3 operating systems. A tale as old as time.

Perhaps the best fix is to just specify monospace. Why a fallback to sans-serif? Does any browser not have a monospace font that is used when you specify monospace?

Removing the quotes from monospace even with it being the only specified font breaks on current chrome mobile.

So... Do we need one monospace with quotes and one monospace without quotes? 🙃

Perhaps the best fix is to just specify monospace. Why a fallback to sans-serif? Does any browser not have a monospace font that is used when you specify monospace?

The problem seems to be desktop isn't picking up the "monospace" and falling back to sans-serif. If we remove sans-serif, it'll fall back to some system default, which will be some sans-serif or serif, but not monospace.

Okay, I tested on 3.9's page, and it seems just

pre {font-family: monospace;}

seems to work. Can someone test it on all 3 platforms, android mac and windows, that'd be great.

Android, Chrome 94

Linux, Chrome 94

Noticed my Firefox 93.0 on win10 is weirded by"monospace" and falls back tosans-serif, though it underlines"monospace" in the style inspector as if it was used. Usingfont-family: "monospace", monospace, sans-serif; seems to work fine, though. Would this variant satisfy Chrome?

✨This is an old work account. Please reference@brandonchinn178 for all future communication ✨

Can confirm, currently fonts ondocs.python.org are NOT monospaced on Chrome.font-family: "monospace", monospace, sans-serif does work.

font-family: "monospace", monospace, sans-serif;

Can confirm, works fine. Even on mobile where justmonospace, sans-serif doesn't.

There is (or was) a known problem with plainfont-family: monospace; that can cause text resizing issues, seenecolas/normalize.css#519 (comment). The workaround isfont-family: monospace, monospace; or
font-family: monospace, anyotherfont;`

Andnecolas/normalize.css#519 (comment) suggests a reason, browsers looked for the fixed stringfont-family: monospace;

Ah, that makes sense now. So I guessmonospace, "monospace"; it is then :P

MacOS Chrome 94monospace

MacOS Chrome 94monspace, "monospace"

Both solutions work for me.

@beauremus Thanks a bunch.