Issue Label Emoji Spacing not Rendering

Hello,

For those that use emojis in their GitHub labels like so:

image

It doesn’t appear like the space of the emoji is being registered in text.

I don’t know exactly how to report this. I have a feeling this has something to do with Chrome updating yesterday?

Anyone else experiencing this problem and if not, any ideas how to fix or is this something that GitHub has to fix?

@ciami7 I don’t find your reply at all productive or constructive. I recommend you first learn better social etiquette before making replies to people’s posts.

1 Like

Emoji spacing is messed up on all rendered markdown. This rule seems to be responsible:

@media (-webkit-max-device-pixel-ratio: 1)
g-emoji {
  display: inline-block;
  width: 1ch;
}

If I disable that rule in dev tools (or override it in a user stylesheet), emoji display correctly.

I can also make emoji display correctly by moving the browser to a display. I’m not familiar with the webkit-max-device-pixel-ratio media query, but it looks like there are better alternatives.

Tested in Chrome & Firefox; Windows 10.

1 Like

Ahh so a problem with webkit, I see. I’ve never touched any of that so hard to know where to go for that.

Github seems to have now fixed this issue. Thanks for your support anyway! Nice work GitHub!

1 Like

I still see no blank after emoji, for what it’s worth (on Chrome), for example in PR comments:

editor shows

image

renders as

image