This is how I see this review on Chrome:

enter image description here

enter image description here

It seems removal of spaces went outside of its area from the left side and looks like something was removed on the right side.

This is very confusing way to see what was actually change, unless you go to the rendered output.

Another example here.

  • 1
    Repro on Chromium 44.0.2403.89; no repro on Firefox 40.0.3. Sep 13, 2015 at 11:39
  • 2
    Very curiously, adding span.diff-delete { white-space: pre } seems to fix this bug on Chromium, but triggers it (as, indeed, one would expect) on Firefox. I'm inclined to call this a Chrome bug. Sep 13, 2015 at 11:58
  • Still reproducible on Chrome 72.0.3626.121. :( Mar 7, 2019 at 14:59

1 Answer 1


I'm pretty sure this is a Chrome bug. In fact, I suspect it's related to this longstanding bug, as described in this SO thread.

Anyway, the answer by Han in that thread suggested a possible work-wround using :after pseudo-elements. I've tested it, and the following CSS hack seems to (more or less) fix the rendering:

/* kluge to avoid Chrome pre-wrap bug: http://meta.stackexchange.com/q/266258 */
.full-diff .diff-delete:after, .full-diff .diff-add:after {
    content: '';
    font-size: 0px;

(The font-size: 0px seems to be necessary; I have no idea why, but removing it makes the hack not work. In any case, we're dealing with a buggy rendering engine here, so there's no reason why any of this should necessarily make sense.)

The CSS hack described above should be safe and have no visible effect on other browsers, since the pseudo-elements it adds are completely empty. I have tested this on Firefox and confirmed that, indeed, there appears to be no visible difference with or without the hack.

And yes, this is going into the next release of SOUP.

You must log in to answer this question.

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