Why do StackOverflow code blocks look awful in Chrome 37?

I've just updated Google Chrome to version 37 on my Linux system. Now code blocks look like this:

enter image description here

And text while I write this question looks like this:

enter image description here

On the same system, the question with code blocks looks ok with Firefox.

What is the problem with fonts in Chrome 37?

Detailed information

According to the Google Chrome developer tools, the following font families were computed:

Consolas, Menlo, Monaco, 'Lucida Console', 'Liberation Mono', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Courier New', monospace, serif;

In Firefox:

Consolas,Menlo,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New,monospace,serif

Martin Thoma

Posted 2014-08-27T17:19:24.763

Reputation: 2 705

Right-click the code block, select "Inspect element", in the right-side panel of the developer console choose the "Computed" tab, scroll down to the bottom, and post the font name that's listed there -- do this both on Chrome and Firefox. I'm wondering if Chrome is choosing a bitmap font... – user1686 – 2014-08-27T17:37:19.343

I meant the font name at the bottom; in Chrome it's under the label "Rendered Font". The computed styles would be same on both browsers anyway, but the actually chosen font might differ. – user1686 – 2014-08-27T17:47:43.360

I'm having a lot of trouble with Chrome on Linux too with certain fonts. I had to edit the .font.cfg file (or something like that) to force it replace those fonts. I'll post later if I have time. – LatinSuD – 2014-08-27T17:53:16.000

Did you installed a new font? – Rosenthal – 2014-08-27T18:35:15.143

I have other fonts besides the stnadard fonts installed, yes. But the last time I've installed a font is at least a month ago. The font problem appeared today. And I've updated Chrome today – Martin Thoma – 2014-08-27T18:37:20.530

4Apparently they switched from using a strongly-typed language to a weakly-typed one. – Daniel R Hicks – 2014-08-27T19:05:11.027

4@DanielRHicks: How does that even... – user1686 – 2014-08-27T19:07:45.270

I had a similar problem (although not related to Chrome and in Windows), that was due to having a crude form of ClearType enabled. Could you have some sort of option on Linux that changes the font rendering or the DPI scale of the text?

– Doktoro Reichard – 2014-08-28T22:31:52.173

@gawity It's a joke. The text is being typed like the typewriter isn't pressing down hard enough. The type is not strong enough. – trlkly – 2014-09-11T22:01:07.647

1This probably belongs on either meta.SO if the problem is specific to SO, or meta.SE – Crippledsmurf – 2014-12-04T02:18:25.347

@Crippledsmurf I think I have read that this problem appears on other pages, too. But SO is the easiest to show for other people (and the most obivious one, because it has so many code blocks). – Martin Thoma – 2014-12-04T09:54:33.700

Answers

Do the following:

Create the file ~/.fonts.conf

Add the following text

<match target="font" >
    <edit name="embeddedbitmap" mode="assign"><bool>false</bool></edit>
</match>

Restart Chrome

Source: https://code.google.com/p/chromium/issues/detail?id=408059

Martin Thoma

Posted 2014-08-27T17:19:24.763

Reputation: 2 705

2Worked for me. Although, font on stackoverflow definitely appears differently than it did before this bug, but at least it is readable now. – minism – 2014-11-05T02:44:34.770

It happened to me just after registering Monaco font using Fedora 19. This answer worked for me as described. – Rubens Mariuzzo – 2014-12-03T23:26:04.907

In recent distro creating the file ~/.fonts.conf will raise a deprecation warning. Instead, create the file at: ~/.config/fontconfig/fonts.conf. More info at: http://askubuntu.com/a/231274/24159

– Rubens Mariuzzo – 2014-12-03T23:46:23.657

You appear to be running into a Chrome 37 bug with Linux font rendering that likely is caused by them updating rendering in Windows. It was supposed to have been fixed before release, according to some posts there, but others are clearly saying it wasn't. Multiple suggestions for dealing with this are offered there, including jumping to the 38 beta or updating your local font information and changing the auto-hint option.

I'll repost their example ~/.fonts.conf, but I would only try it as a last resort. Try the beta first.

<?xml version="1.0"?>
<!DOCTYPE fontconfig SYSTEM "fonts.dtd">
<fontconfig>
  <match target="font">
    <edit name="autohint"><bool>false</bool></edit>
  </match>
</fontconfig>`

trlkly

Posted 2014-08-27T17:19:24.763

Reputation: 1 236

I had the same problem. OS: Linux Mint 17 Cinnamon with font extensions.

Check the Zoom of your current Chrome display. Reducing or increasing zoom should clarify your font rendering.

Dave Burke

Posted 2014-08-27T17:19:24.763

Reputation: 11

1Well ... I really don't want to use websites with 110% zoom. That is nice to know, but not an answer. – Martin Thoma – 2014-08-27T20:55:37.643

Edit ~/.fonts.conf is working for me, my ~/.fonts.conf (debian Jessie, xfce4, chrome 43.0.2357.81 (64-bit)) is:

<!-- put to ~/.fonts.conf to improve chrome font rendering -->
<match target="font">
<edit name="autohint" mode="assign">
<bool>true</bool>
</edit>
<edit name="hinting" mode="assign">
<bool>true</bool>
</edit>
<edit mode="assign" name="hintstyle">
<const>hintslight</const>
</edit>
</match>

kurtmeln

Posted 2014-08-27T17:19:24.763

Reputation: 1

The question seems to be about version 37. Do you know if your solution would work with version 37 as well as version 43? – Jason Aller – 2015-07-09T02:44:21.397

Works on version 37 for me, but this should depend on which platform you are using, you can try these options one by one if it doesn't work. – kurtmeln – 2016-01-25T07:00:45.483