on many monitors, the very light gray background color of code blocks looks like 100% white, when looking at the monitor with even just a slight angle. While I do believe, that it wouldn't look good, if it were a lot darker, I feel that making it just a tiny little bit darker would help to separate it from the rest of the text.

Especially, when the spans are inlined in the rest of the text, and the code word could accidentally fit into the sentence, this is sometimes important to avoid confusion. And the font alone isn't different enough IMO to accentuate these small bits of text.

About padding:

In exchange, we could/should get rid of the extra padding around inline code, which many people (including myself) find distracting. This also includes vertical padding of the background box: Between two consecutive lines like


there should be at least one pixel of vertical white-space separating the background boxes.

Alternative: Highlight code with a different foreground color.

What do you think?


  • 1
    I disagree (see: meta.stackexchange.com/questions/33709/… for my reasoning... and also some custom CSS I use to make the background disappear entirely!)
    – Shog9
    Mar 21 '10 at 17:08
  • Yeah, maybe the alternative you suggested (different foreground color) could work even better! What's important for many answers though, is that readers must know, which parts are code, and which are not (especially, when using APIs that assign a specialized meaning to words like connection (an object of type Connection), but also use the word connection in a broader sense in their documentation. Mar 21 '10 at 17:16
  • 3
    @Shog9: And I think that you're absolutely right about the annoying extra padding for inline code! IMO, we should just have a background color (or alternatively a foreground color). And to avoid the "rivers" you mention in your post, the background color shouldn't exceed the text size - so there would still be vertical white line-spacing). Mar 21 '10 at 17:33
  • This (background too light) is especially true on superuser. Mar 24 '10 at 17:03

I have two monitors and the difference between the two is.. astonishing.

In the first it's almost impossible to see, in the second it's very very dark and easily noticeable.

  • 1
    I'd say that the 'easily noticeable' monitor is set up and working correctly and the other one isn't. For help diagnosing problems with your monitor, please consult your monitor's user manual. If that doesn't help, contact your monitor manufacturer. Unfortunately stackoverflow or any website is not able to detect and correct for faulty or incorrectly adjusted monitors. Mar 22 '10 at 2:06
  • @thomas: they are just two different monitors and one is better than the other, nothing wrong with the settings :) Mar 22 '10 at 2:19
  • I had the same problem with a computer we have in our lab. The issue is not hardware related but rather the gamma setting is way too high on your graphics driver. Most graphic drivers should allow you to just gamma down slightly until the code blocks become visible again.
    – SiegeX
    Feb 3 '11 at 19:39

I disagree. Since every monitor on the world has different settings, you will always have people who find it too light or too dark. The best guess is to choose the colors such that they look fine on a monitor that's close to sRGB – and this is currently the case.

  • 2
    I think that the 231,231,231 value that is used as the background for user names (in comments) can be distinguished on all of my 5 quite different monitors quite easily (a MacBookPro, a high quality Samsung, a medium quality LG, an old Laptop screen, and a Netbook). Except for the high end Samsung, the 238,238,238 value that is used for code is hard to distinguish on all of them, and vanishes completely when viewed at a little angle. Mar 21 '10 at 16:13

Perhaps this is a case where a <div> element with a 1px border might be useful to make the distinction more clear.

Heck, it's probably pretty easy to do drop shadows in CSS now. I wouldn't know; my last foray into HTML design was several years ago (back when HTML 3 was the "hottest thing ever"). :)

  • 1
    Text shadows are reasonably well supported (that is, unless you consider IE). They do tend to look a bit odd on inline text though...
    – Shog9
    Mar 21 '10 at 17:21
  • @Shog: yeah, it would look pretty tacky, but might be fun on meta.
    – Ether
    Mar 21 '10 at 17:30

You must log in to answer this question.

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