[Support request] Change background color of layout container

[John]

Hi: The pages on my site are contained layouts, using default templates, and with Elementor page builder on most pages. I’m trying to figure out how to customize the entire website background color, seems to consist of three parts: the body outside the container, the sections (which are sometimes smaller than the container), and the part between the sections and outside of the container. I can change the background color of sections, but how do I change the color of the entire container itself? Please see sample page below – you can see that the body outside the container is set at f8f8f8 by default, and I also set the background color of the top section as f8f8f8, which leaves the strip between the two as ffffff. The part I can’t figure out how to change is the area with the color ffffff. Thanks.

[Leo]

Hi there,

The #ffffff should be coming from Colors > Content > Background.

However, the issue here is this CSS added by SO-CSS:

#main.site-main {
    padding-left: 40px;
    padding-right: 40px;
}

If you remove that then the space should disappeared.

Let me know if this helps 🙂

[rossnmia]

hi – I cannot change the background container color. I have set this in Customize>Colors>Background but it’s still the coloraturas you can see here: https://tinytodolsist.com

I am using Charge theme, does this theme override the background color?

UPDATE: Found the answer, it is in the css settings

[David]

Glad to hear you found the solution 🙂

[Lyes]

Hello,

Can you tell me what solution have you found ?

I want to change the background color of the container via the Customizer > Colors > Content, but i have the #f8f8f8 color by default.

Thanks a lot.

Lyes.

[David]

Hi there,

can you create a new Topic where you can use the Site URL field to privately share a link to your site – and i can take a look at what the issue is.

[Lyes]

Ok Thanks.

[Author]

Posts