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

Do the following:

  1. Create the file ~/.fonts.conf
  2. Add the following text

    <match target="font" >
        <edit name="embeddedbitmap" mode="assign"><bool>false</bool></edit>
    </match>
    
  3. Restart Chrome

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


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>`