Custom CSS with gradient background color stopped working

Just got off a live chat for this issue with no result as they refuse to help me when it's related to custom CSS.

I've had code to have my background color every other section as an orange gradient and it has worked for about a year now. All of a sudden without any changes on the website for a good while, it has stopped working. The last thing I did was playing around with a plugin for a gallery and while working with it the gradients worked just fine. It also worked fine after this, so I don't think it causes the problem. Removing the code for it doesn't help either.

I tried to copy section-IDs again to make sure it was still the correct ones in the code, but nothing.

What could be the problem here? The gradients really made the whole website...

15 hours ago, Polyscans said:

Just got off a live chat for this issue with no result as they refuse to help me when it's related to custom CSS.

I've had code to have my background color every other section as an orange gradient and it has worked for about a year now. All of a sudden without any changes on the website for a good while, it has stopped working. The last thing I did was playing around with a plugin for a gallery and while working with it the gradients worked just fine. It also worked fine after this, so I don't think it causes the problem. Removing the code for it doesn't help either.

I tried to copy section-IDs again to make sure it was still the correct ones in the code, but nothing.

What could be the problem here? The gradients really made the whole website...

Can you share your site with the protected password so I can take a look?

The website is public: https://grapefruit-frog-cpsc.squarespace.com/

It's live at polyscans.no. Not sure if you need more to take a look, I'll provide if you need anything else thanks.

On 12/19/2022 at 4:47 PM, Beyondspace said:

You can try the following code on Home > Design > Custom Css

.page-section.background-width--inset .section-border {
  background: transparent;
}

Support me by pressing 👍  or marking as solution if this useful for you

Thank you so much, this seems to have solved it. So based on the code you provided and the small amount of knowledge I have about it, is it correct that the dark color were basically overlaying the gradient from my code?

Also, do you know what caused this? Only thing I can think of is upgrading sections to the Fluid engine, but I'm fairly certain that the gradient worked a while after upgrading so I'm not sure if it's even related.

Again, thanks!

Squarespace have just updated some new features and they add new element on section background. So it may cause your issue

Hello again,

I just jumped back into my website again and while the code you provided did fix most sections, there's actually still a few sections that still won't show my colors. Seems like the thing they have in common is that there's embed blocks on all of them.

Would you happen to know a way to fix these as well?

On 3/9/2023 at 7:46 PM, Polyscans said:

Hello again,

I just jumped back into my website again and while the code you provided did fix most sections, there's actually still a few sections that still won't show my colors. Seems like the thing they have in common is that there's embed blocks on all of them.

Would you happen to know a way to fix these as well?

Can you share link to page where you have problem? We can help easier

Hi all. I've experienced the same issue on my site. Has any resolution been discovered? Thank you!

On 3/12/2023 at 2:59 AM, jennnnnnw said:

Hi all. I've experienced the same issue on my site. Has any resolution been discovered? Thank you!

Add this to Design > Custom CSS

.section-border {
  background: transparent;
}

Hey everyone, 

I'm having a similar issue. My website has Custom CSS for a light grey-dark grey gradient, which has all of a sudden stopped working. Now there is just a plain white background even though I haven't altered the code at all. 

It's strange because I have other custom CSS that is still working fine? Website is www.dojomediaco.com

Any advice would be appreciated! Here's the code I've been using for the gradient;

.page-section, .section-background{background:transparent!important;}
.site-wrapper{background: linear-gradient(to right, #fcfcfc, #e0e0e0)!important;}

On 3/17/2023 at 5:56 AM, LoganPearce said:

Hey everyone, 

I'm having a similar issue. My website has Custom CSS for a light grey-dark grey gradient, which has all of a sudden stopped working. Now there is just a plain white background even though I haven't altered the code at all. 

It's strange because I have other custom CSS that is still working fine? Website is www.dojomediaco.com

Any advice would be appreciated! Here's the code I've been using for the gradient;

.page-section, .section-background{background:transparent!important;}
.site-wrapper{background: linear-gradient(to right, #fcfcfc, #e0e0e0)!important;}

 

Change your code to this

.page-section, .section-background, .section-border, .section-divider {background:transparent!important;}
.site-wrapper{background: linear-gradient(to right, #fcfcfc, #e0e0e0)!important;}