Simple Background Change with CSS?

Custom code
1

Hey,

I do have a simple question.

How do I change the background of my project using CSS?

For example, I tried using this code:

body {
background-color: #232323;
background-image: url(“https://www.transparenttextures.com/patterns/clean-gray-paper.png”);
background-size: cover;
background-repeat: repeat;
background-position: center center;
!important;
}

But unfortunately this does not do anything at all. I tried all sorts of changes to the code but I just can’t get it to work. It is supposed to be a repeated texture background, but I couldn’t even do a simple solid colour change with CSS.

Is there something I am missing in general?

Thanks in advance!

Kind regards
Luis

2

well, yes, you have to get the right div container that is setting the backgroundcolor… its not body! Check the devtools and look into the css value fo find the right div.

3

Thank you so much for your tips! I tried to do so and found something called “main-background”. I tried again but I think it’s still not quite right.

div id="main-background (in <>-brackets)

{
background-color: #232323;
background-image: url(“https://www.transparenttextures.com/patterns/clean-gray-paper.png”);
background-size: cover;
background-repeat: repeat;
background-position: center center;
}

I am incredibly grateful for any help, as I obviously do not have any experience with this. Thank you so much! :slight_smile:

4

“.content-scroll-wrapper” might be the thing to look at

.content-scroll-wrapper
{
background-color: #232323;
background-image: url(“https://www.transparenttextures.com/patterns/clean-gray-paper.png”);
background-size: cover;
background-repeat: repeat;
background-position: center center;
}
6

Thanks again for your fast reply. Unfortunately this does not work either. Could the problem be a totally different thing?

7

Hey David, thank you so much for your help. Unfortunately this does not do anything to my page at all. Could the problem be a totally different thing or do you have other ideas? :slight_smile:

8

If I insert this code into the css panel it works… pls check again

9

You are totally right! My Readymag-preview did not show the changes, but I just published the site and reloaded it in a new tab and: it works!

Thank you so much for your patience! <3

10

Actually now I do encounter new problems. Feel free to ignore my question if you do not want to bother with this anymore. You already helped me a lot!

Using the code below, the problem is that the background-pattern is fixed while scrolling. I already tried using “background-attachment: scroll;” but it does not solve the problem. Do you (or anybody else) has an idea, how to fix that?

.content-scroll-wrapper {
background-color: #ffffff;
background-image: url("https://www.transparenttextures.com/patterns/cardboard-flat.png");
background-attachment: scroll;
}

``

Thanks in advance!

11

then you would need to throw out the css stuff and just place your background as a imageelement on each page and fix it in the back.