All custom CSS stopped working

Hello all,

I've used (in an amateur way) custom CSS for years now, to tweak parts of my website.

Today, I logged into the CSS section, with the intention of removing spacer blocks on mobile, on 2 specific pages. No sooner had I opened the CSS input area, than I noticed all the custom code on my site has disappeared. Help needed!

Kind regards,

David Cass

You may want to talk to Squarespace Support, this forum can't deal with technical issues.

Did you try refreshing the page, or clearing your browser cache and logging back in to check if your CSS is there?

Thanks @Ziggy. I spoke to Squarespace, and while they can't offer exact css help, they did suggest that there was an error in my code. I found the error (a missing "}") and it's now working. 

While I have you, might I ask, do you happen to know how I can disable spacer blocks on specific pages, on mobile only? The collage-style spacing on this page (https://davidcass.art/2020-2021) works well on desktop, but not on mobile. Any ideas?

Something like this should work for that page:

@media only screen and (max-width:640px) {
  #collection-5fcfc8e228714b03f1bb3502 {
    .sqs-block-spacer {
      display:none;
    }
  }
}

That worked perfectly @Ziggy, huge thanks.

All my css stopped working last night (July 30)  Code that has been functioning for years. I checked it against http://csslint.net/  Does anyone know of some weird SS glitch that may cause this to happen? 

SS customer service will not touch the css issue.

29 minutes ago, Pancake said:

All my css stopped working last night (July 30)  Code that has been functioning for years. I checked it against http://csslint.net/  Does anyone know of some weird SS glitch that may cause this to happen? 

SS customer service will not touch the css issue.

Yep, me too. My CSS is all there, there are no errors, and yet random bits of code are applying and then not applying with no rhyme or reason. It started with my custom fonts (which adding !important partly helped), but with every refresh of the site, something else is losing styling. It's making me crazyyyyy!

11 minutes ago, mbockmaster said:

Yep, me too. My CSS is all there, there are no errors, and yet random bits of code are applying and then not applying with no rhyme or reason. It started with my custom fonts (which adding !important partly helped), but with every refresh of the site, something else is losing styling. It's making me crazyyyyy!

None of my CSS is working. Have you contacted customer support yet? I have checked SS for site wide outages and there are none. I checked my client's websites and their code is 100% intact. Curious which platform are you using for your website?

2 minutes ago, Pancake said:

None of my CSS is working. Have you contacted customer support yet? I have checked SS for site wide outages and there are none. I checked my client's websites and their code is 100% intact. Curious which platform are you using for your website?

I'm on 7.1, still building. I was just talking to support and they've had no other reports of this issue. The rep I spoke to on live chat will be passing on my email to a tech support person by the end of the day (which I hope for him, is soon as I don't have time to waste!). My colours are working, and every once in a while I'll refresh and get the correct styling...Only to lose it in another place. Very strange that none of your code is working at all.

I am on 7.1 as well. I will open a live chat to report the issue there as well. Fingers crossed all remedies soon.

2 minutes ago, Pancake said:

I am on 7.1 as well. I will open a live chat to report the issue there as well. Fingers crossed all remedies soon.

The more reports, hopefully the faster the resolution! Keep me posted.

Update: Two live chats. First chat ended without notice after disclaiming SS will not assist. Second chat said they would look into the issue and took my email address for follow up. Your chat said no one else reported the issue. Hmmmm. Let's keep chatting with them over the day (s).... 

Any updates from your end? 

I am having the same issue with custom code. I have been trying to insert a Constant Contact sign up in my website footer for over an hour following all the instructions and the chat said they could not help that I had to contact CC. 

I told them they need to escalate the issue but I got the generic "thank you for your suggestion but we can't guarantee any changes will be made" BS reply.

ETA: Ooh I got really snippy with the chat agent and I'm supposedly being transferred to "someone who can help." If I get anything useful I'll add another comment. 

6 hours ago, Bibliobadger said:

I am having the same issue with custom code. I have been trying to insert a Constant Contact sign up in my website footer for over an hour following all the instructions and the chat said they could not help that I had to contact CC. 

I told them they need to escalate the issue but I got the generic "thank you for your suggestion but we can't guarantee any changes will be made" BS reply.

ETA: Ooh I got really snippy with the chat agent and I'm supposedly being transferred to "someone who can help." If I get anything useful I'll add another comment. 

Can you share link to your site? We can check easier

I am having the same issue. It just started last night.

No response from customer support. (I did get a survey monkey from them, but no response on the issue.)

Custom font stopped working first, now I don't see any CSS that's working. It's seriously stressing me out. Had anyone found a solution on this?

www.flippedpot.com

5 hours ago, jello76 said:

I am having the same issue. It just started last night.

No response from customer support. (I did get a survey monkey from them, but no response on the issue.)

Custom font stopped working first, now I don't see any CSS that's working. It's seriously stressing me out. Had anyone found a solution on this?

www.flippedpot.com

Can you share your CSS code?

10 minutes ago, Web_Solutions said:

Can you share your CSS code?

www.flippedpot.com 

//ADDING BLITHE FONT//
@font-face {
  font-family: 'Blithe';
  src: url(https://static1.squarespace.com/static/6442e77bd742137cdac58347/t/64e06f84398b362f22675198/1692430212975/Blithe.ttf) ;
}
//ASSIGN BLITHE FONT//
H2 {font-family: 'Blithe'!important;} 
h2 {font-family: 'Blithe'!important;}
h3 {font-family: 'Blithe'!important;}
h4 {font-family: 'Blithe'!important;}
.header-title-text a {font-family: 'Blithe'!important;}
.header-nav-item a {font-family: 'Blithe' !important;}
.header-actions-action .btn {font-family: 'Blithe' !important;}
.newsletter-form-header-title {font-family: 'Blithe' !important;}
.newsletter-form-header-description p {font-family: 'Blithe' !important; }
.blog-title {font-family: 'Blithe' !important;}
.blog-item-title h1.entry-title { font-family: 'Blithe' !important;}
//Header Page Navigation//
.header-nav-item {transform:scale(1.35)}
.header-nav-item a:hover {fill:#4DDDFA!important; transform:scale(1.5); filter:drop-shadow(2px 2px 0px #4DDDFA)}
.header-title-text a:hover {fill:#4DDDFA!important; transform:scale(1.5); filter:drop-shadow(2px 2px 0px #FFBD1A)}
//Footer//
#block-8188f18f25f9775f971b a:hover {transform:scale(1.1); filter:drop-shadow(2px 2px 0px #1D2B2E)} 
#block-560cba48d0f3f630c25f a:hover {transform:scale(1.1); filter:drop-shadow(2px 2px 0px #4DDDFA)}
//GOT a Clay Body Font-JOIN Page//
#block-e9b88c380a32a83748ed .Marquee * {color: #fffdef; text-shadow: 2px 2px #fae667}
// Hamburger Menu Colour //
.burger-inner > div {
background-color: #FFBF00 !important}
//Home Page-text Shadows//
#block-9c44ae1b36fb44428ad8, #block-a27d1a533e03ab9b75b3, #block-560a12eb844f0cc9ca92, #block-f09b4c0635104b004729, #block-yui_3_17_2_1_1685331130972_8881, #block-yui_3_17_2_1_1691629636425_264199  {text-shadow: 2px 2px #1D2B2E}
#block-yui_3_17_2_1_1691629636425_264199
//Join Page-text Shadows//
#block-daa1e0b10db7d6adf11e, #block-15f518e5d6e5f713e3cf, #block-87c4c3d73dafc9fbd919, #block-b339df5b2a88c921f06d, #block-23aba0bd02ddc0924090, #block-a4075e9c4e491fbbcdfa, #block-39e88ad10eae1ed4faed, #block-e1f63c9e53ffe4d8d571, #block-1002413a6e3240dfebdf {text-shadow: 2px 2px #FFBD1A}
#block-721bb27edb37d38c4168, #block-773fd85ce499d8f0ddde, #block-ae2e87ae7f933bace4b8, #block-1f32c4344cdf946f8abf {text-shadow: 2px 2px #FFBD1A},
Marquee* {color:FAE667!important}
//SOCIAL ICONS-header//
.header-actions .icon--fill svg {fill: #FFBD1A!important}
.header-actions .icon--fill svg:hover {fill:#4DDDFA!important; transform:scale(1.5); filter:drop-shadow(2px 2px 0px #FFBD1A)}
//SOCIAL ICONS-mobile only//
.header--menu-open .header-menu .icon svg {fill: #FFBD1A!important}
.header--menu-open .header-menu .icon svg:hover {fill: #4DDDFA!important; transform:scale(1.5); filter:drop-shadow(2px 2px 0px #FFBD1A)}
.header .header-actions, .header .header-actions-action--social {display: flex}
.header .header-title-nav-wrapper {flex: 47%;}
@media only screen and (pointer: coarse) and (max-width: 1024px), screen and (max-width: 799px) {
.header-actions--center .header-actions-action--social .icon:not(:first-child) {margin-left: 1vw;}}
@media only screen and (max-width:767px) {.header .header-mobile-layout-logo-center-nav-right .header-display-mobile .header-title {padding-right: 1vw; }}
//SOCIAL ICONS-page//
.sqs-use--icon {fill: #4DDDFA!important;}
.sqs-use--mask {fill: #FAE667!important;}
//Center button Media Only//
@media only screen and (max-width:640px) {
.image-button-inner {text-align: center !important;}
}
//ABOUT PAGE flipped Q//
#block-yui_3_17_2_1_1684088496765_10387 {transform:rotate(-15deg)}
#block-yui_3_17_2_1_1684088496765_10387 {text-shadow: 2px 2px #1D2B2E}
//ABOUT PAGE BIO PIC MOBILE VIEW//
@media only screen and(min-width:641px) {section[data-section-id="6473b61df8ae6511b11b1af9"]{display:none}}
@media only screen and (max-width:640px) {section[data-section-id="64605695b4e058414712309e"]{display:none}}

17 minutes ago, Web_Solutions said:

Can you share your CSS code?

It seems it's not just the font that quit now. None of it is working. It was all fine yesterday. Today no code is working.

1 minute ago, jello76 said:

It seems it's not just the font that quit now. None of it is working. It was all fine yesterday. Today no code is working.

Wait please. I'm checking 

Can you add this code now

//ADDING BLITHE FONT//
@font-face {
  font-family: 'Blithe';
  src: url(https://static1.squarespace.com/static/6442e77bd742137cdac58347/t/64e06f84398b362f22675198/1692430212975/Blithe.ttf) ;
}
//ASSIGN BLITHE FONT//
H2 {font-family: 'Blithe'!important;} 
h2 {font-family: 'Blithe'!important;}
h3 {font-family: 'Blithe'!important;}
h4 {font-family: 'Blithe'!important;}
.header-title-text a {font-family: 'Blithe'!important;}
.header-nav-item a {font-family: 'Blithe' !important;}
.header-actions-action .btn {font-family: 'Blithe' !important;}
.newsletter-form-header-title {font-family: 'Blithe' !important;}
.newsletter-form-header-description p {font-family: 'Blithe' !important; }
.blog-title {font-family: 'Blithe' !important;}
.blog-item-title h1.entry-title { font-family: 'Blithe' !important;}
//Header Page Navigation//
.header-nav-item {transform:scale(1.35)}
.header-nav-item a:hover {fill:#4DDDFA!important; transform:scale(1.5); filter:drop-shadow(2px 2px 0px #4DDDFA)}
.header-title-text a:hover {fill:#4DDDFA!important; transform:scale(1.5); filter:drop-shadow(2px 2px 0px #FFBD1A)}
//Footer//
#block-8188f18f25f9775f971b a:hover {transform:scale(1.1); filter:drop-shadow(2px 2px 0px #1D2B2E)} 
#block-560cba48d0f3f630c25f a:hover {transform:scale(1.1); filter:drop-shadow(2px 2px 0px #4DDDFA)}
//GOT a Clay Body Font-JOIN Page//
#block-e9b88c380a32a83748ed .Marquee * {color: #fffdef; text-shadow: 2px 2px #fae667}
// Hamburger Menu Colour //
.burger-inner > div {
background-color: #FFBF00 !important}
//Home Page-text Shadows//
#block-9c44ae1b36fb44428ad8, #block-a27d1a533e03ab9b75b3, #block-560a12eb844f0cc9ca92, #block-f09b4c0635104b004729, #block-yui_3_17_2_1_1685331130972_8881, #block-yui_3_17_2_1_1691629636425_264199  {text-shadow: 2px 2px #1D2B2E}
#block-yui_3_17_2_1_1691629636425_264199,
//Join Page-text Shadows//
#block-daa1e0b10db7d6adf11e, #block-15f518e5d6e5f713e3cf, #block-87c4c3d73dafc9fbd919, #block-b339df5b2a88c921f06d, #block-23aba0bd02ddc0924090, #block-a4075e9c4e491fbbcdfa, #block-39e88ad10eae1ed4faed, #block-e1f63c9e53ffe4d8d571, #block-1002413a6e3240dfebdf {text-shadow: 2px 2px #FFBD1A}
#block-721bb27edb37d38c4168, #block-773fd85ce499d8f0ddde, #block-ae2e87ae7f933bace4b8, #block-1f32c4344cdf946f8abf {text-shadow: 2px 2px #FFBD1A} 
Marquee* {color:FAE667!important}
//SOCIAL ICONS-header//
.header-actions .icon--fill svg {fill: #FFBD1A!important}
.header-actions .icon--fill svg:hover {fill:#4DDDFA!important; transform:scale(1.5); filter:drop-shadow(2px 2px 0px #FFBD1A)}
//SOCIAL ICONS-mobile only//
.header--menu-open .header-menu .icon svg {fill: #FFBD1A!important}
.header--menu-open .header-menu .icon svg:hover {fill: #4DDDFA!important; transform:scale(1.5); filter:drop-shadow(2px 2px 0px #FFBD1A)}
.header .header-actions, .header .header-actions-action--social {display: flex}
.header .header-title-nav-wrapper {flex: 47%;}
@media only screen and (pointer: coarse) and (max-width: 1024px), screen and (max-width: 799px) {
.header-actions--center .header-actions-action--social .icon:not(:first-child) {margin-left: 1vw;}}
@media only screen and (max-width:767px) {.header .header-mobile-layout-logo-center-nav-right .header-display-mobile .header-title {padding-right: 1vw; }}
//SOCIAL ICONS-page//
.sqs-use--icon {fill: #4DDDFA!important;}
.sqs-use--mask {fill: #FAE667!important;}
//Center button Media Only//
@media only screen and (max-width:640px) {
.image-button-inner {text-align: center !important;}
}
//ABOUT PAGE flipped Q//
#block-yui_3_17_2_1_1684088496765_10387 {transform:rotate(-15deg)}
#block-yui_3_17_2_1_1684088496765_10387 {text-shadow: 2px 2px #1D2B2E}
//ABOUT PAGE BIO PIC MOBILE VIEW//
@media only screen and(min-width:641px) {section[data-section-id="6473b61df8ae6511b11b1af9"]{display:none}}
@media only screen and (max-width:640px) {section[data-section-id="64605695b4e058414712309e"]{display:none}}

Holy cow. What did you do? That fixed everything! Thank you so much!! 

2 minutes ago, jello76 said:

Holy cow. What did you do? That fixed everything! Thank you so much!! 

You made some errors in the code. I have fixed and it working.

Just now, Web_Solutions said:

You made some errors in the code. I have fixed and it working.

Thank you so much!! 

Just now, jello76 said:

Thank you so much!! 

You're welcome!