I don’t tell you guys how much I love Discourse enough. I love Discourse. Thank you for creating it, always making it better, and offering great support
I added a background image, which I’m happy with. However, it’s behaving strangely in the header. When I scroll up to far you can see a second image poking it’s head out from behind, and just looking a little scrappy. Can anyone tell me how to fix this, I assume by removing it from the header section or something. Bear in mind I’m a luddite, so need some pretty clear instructions. Thanks!
The issue you’re seeing occurs because you’ve set a background on the <html> tag and gave it a position manually with the background-position property.
In the background component there’s a rule that looks like this:
html {
background-position: 50% 30px;
}
This centers the background horizontally and pushes it down by 30px vertically.
Since you didn’t set a background-repeat property, it defaults to repeat which means that when you push the background-image by 30px vertically, it will repeat itself in that space.
There are a couple of way to fix this, but I’ve opted for the simplest option.
I changed to background-position property in your theme from
html {
background-position: 50% 30px;
}
to
html {
background-position: center;
}
which should center the background and stop it from repeating and fix the issue on your site
