Color section same width of column full width

Hello Rikard.

I’d like to target by class specific Color Sections, obtaining the result in the images linked below.
I don’t want any space (left and right) between the Color Section and the Column Section within.
And I want to apply this behaviour for any screen size.

The grey container is a Colour Section.

Here it’s the result I want to obtain. But only for specific Colour Sections targeting a class I added in Color Section Advanced —> Developer Settings —> Custom CSS class (The name of the class is “fitting-color-section”)

Thanks

• This reply was modified 5 years, 2 months ago by umberto83.

Thanks Rikard,

I actually polished a bit the CSS you suggested me.

#container-fitt  {
    max-width: 1310px ;
    width: 85% ;
    padding: 0 ;
    position: relative;
    left: 50%;
    transform: translate(-50%);
}
#container-fitt .container {
    max-width: 1310px !important; /* The important here it's to overwrite the media queries for small screens */
    width: 100% !important; /* Same as above */
    padding: 0 ;
    margin: 0 ;
}

Now the content of the color section is full width and the section itself has the same with of all the rest of the site.
I added the id #container-fitt, so I can manipulate only the color sections I want.

I have a general question, does the quick CSS get lost when you update the theme? or it is safe.

Thanks