Since a month now, the banner of both the main site and the Meta site have this strange effect (a dithering problem?):

enter image description here

It is more apparent on the right side:

enter image description here

  • I'm using Firefox 83.0. In Edge there is no problem. I don't have Chrome to test it.

  • Using the Inspector, the problem seems to be (the positioning of) background-image: url("img/header-background-image.svg?v=fe2fd5316ad9"); of the .site-header class. The image seems to be drawn using a simple block of pixels.

  • The Dark Reader plugin I use is not the problem.
    Other plugins I use only block scripts (AFAIK) and shouldn't influence the drawing of static images.

Does anyone else have this problem, or a potential fix?

  • 1
    I have noticed this too, it's supposed to be scanlines. Zoom to 80% or 120% and it fixes itself up, which makes me think the background image is not properly configured for certain screen sizes
    – Robotnik Mod
    Dec 1 '20 at 10:32
  • You're right: currently it renders fine when on 80% and 120% zoom. Resizing the browser window also has an obvious effect.
    – Joachim
    Dec 1 '20 at 10:49
  • What is your monitor resolution?
    – Nzall
    Dec 1 '20 at 12:48
  • @Nzall 1920 by 1080.
    – Joachim
    Dec 1 '20 at 15:13
  • Still, as mentioned, I've never seen this problem before, so it might have been introduced with the latest Firefox version.
    – Joachim
    Dec 1 '20 at 15:14
  • 1
    I don't feel like it's the size, as 1920x1080 is 16:9, the standard screen size, and when I use this site on my iPhone or iPad it works completely fine.
    – Penguin
    Dec 2 '20 at 21:25
  • 1
    Meta site has the same problem: gaming.meta.stackexchange.com/questions/15825/…
    – Timmy Jim Mod
    May 12 '21 at 0:23

You must log in to answer this question.

Browse other questions tagged .