Archived topic
Background color change with CSS, GPP+Elementor
3 replies · Started by Alec on November 8, 2019
This is a very elementary question.
When I try to change the background color for a certain page from the default dark to white, the usual command
body.page-id-xxxx {
background-color: #fff;
}
has no effect. Instead, I need to write these entrances for it:
.page-id-xxxx .container {
background-color: #fff;
}
and then
.page-id-xxxx {
background-color: #fff;
}
the last one is to get read of the fields (margins) on the left and right sides of the container that remain dark.
I am using GPP + Elementor. Does Elementor affect default GP behavior?
The same thing happens when I try to change color in the customizer, the page/post background color is divided into two:
1. body (this controls the margins
2. content (inside the content)
I am using the theme's default GP's layout (not Elementor canvas or Elementor's full-width)
Hi there,
main reasons:
1. If the container is set to full width like it is on the Home Page, then the content covers the body.
2. The background color has been set in Elementor:
https://docs.elementor.com/article/193-document-settings
If you can link me to the page with the issues i can take a look
I am using the default theme's layout. Your thought about the container and body was helpful for me to understand their functioning. So while 'playing' with new test page (no Elementor), I realize now in order to change the backgr. color, I need to address 2 things - body and container. Although these are very basics but, I needed to understand...
I am using your strategy for GP + Elementor from the very beginning: https://generatepress.com/forums/topic/guidelines-to-use-elementor-with-generatepress/#post-870937
that is very helpful, I like to use GP's the most, Elementor only for inside content. I hope one day to drop Elementor and use only GPP (only a matter of mastering it).
I change color globally via customizer (mostly for posts) and then go to Elementor.
I'll make a layout element with the full container to use with E.
Thank you, David, for your useful tips.
You're welcome
Glad you found the tips useful
