25

In chatting, I've taken to using bold to format code. This is because it does not stand out very well if the only thing that changes is a fixed-width font. For instance:

Demonstrate bold is better than fixed-width with no background change

But it seems that if CSS were applied to use a fixed width font and change the background color, that would be a better solution. I'm not sure of the entire implications, but here's a test:

With CSS applied for background

Improve this question
4
  • Code appears more bold if it is bolded (**`code`**), and text-shadow: 1px 0 #000 is applied to it: i.stack.imgur.com/zvVBG.png
    – uınbɐɥs
    Feb 10, 2013 at 23:27
  • 1
    yes please this would be really helpful!
    – Jack Douglas
    Mar 6, 2013 at 18:13
  • 2
    Basically, hearing something official from SE staff on this would be awesome.
    – Kaz Wolfe
    Jan 15, 2017 at 23:40
  • Ditto. If I interpret the existing answers correctly, they allow me to highlight the code for myself. But when I'm chatting and posting code I want everyone else to easily distinguish code from everything else, regardless if they bothered to install some script or another prosthesis. This issue should definitely be fixed on the server side.
    – Kamil Maciorowski
    Apr 11, 2021 at 10:46

2 Answers 2

Reset to default
8

I have written a UserScript that automatically highlights code in chat messages. Example:

More information and download links can be found here:

Highlight Code in Chat - Highlights <code> elements contained in chat messages

Improve this answer
7
  • Could you also add chat.se/transcript/* and highlight <pre> as well?
    – Lorem Ipsum
    Feb 11, 2013 at 3:22
  • Cool. Having a user script is nice as a prototype to test the idea, but a lot of people use chat without extensions. Something like this that affects the commonly perceived display isn't really a "power user" chat feature, but rather seems it should be built in...
    – HostileFork says dont trust SE
    Feb 11, 2013 at 5:43
  • @LoremIpsum: Done.
    – uɐɯsO uɐɥʇɐN
    Feb 11, 2013 at 8:08
  • @HostileFork: Yes, but the impression I get from the OP is that those who need the feature are the ones who would be able to easily install the UserScript.
    – uɐɯsO uɐɥʇɐN
    Feb 11, 2013 at 8:09
  • @GeorgeEdison Thanks, but the <pre> blocks are not highlighted though...
    – Lorem Ipsum
    Feb 11, 2013 at 15:39
  • @LoremIpsum: Hmm... I'll fix that shortly. Sorry about that oversight.
    – uɐɯsO uɐɥʇɐN
    Feb 11, 2013 at 22:43
  • @LoremIpsum: Sorry for the long delay - I have now updated the script.
    – uɐɯsO uɐɥʇɐN
    May 3, 2013 at 19:12
3
+50

You can get a similar effect with a user style:

@-moz-document domain("chat.stackexchange.com") {
    div.message pre, div.message code {
        background-color: lightgrey;
        padding: 0.2em;
    }
}

Tweak the colour, opacity, and padding to your liking.

Prerequisite: Stylish browser add-on

Improve this answer

You must log in to answer this question.

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