Jump to content

Missing Closing '}' in Custom CSS with no Way to Find it

Recommended Posts

Hey all, 

I hope someone can help me. I'm trying to add two pieces of Custom CSS to my square space site. First off, I've done this exact same coding on a page for another site, it's a shared page that will be the same on two different webpages, so I'm basically duplicating the page for another site. On the first page this coding worked perfectly, on this other site, it's not.

I basically have a code that will allow me to change the font color for both P and H1 in a specific block, which has worked, like I said on another page. The other code is changing the font size of a font in a specific block (ie making it fine print). So, when I applied the coding in the Custom CSS, nothing happened. Despite it being the exact same code, minus the block ID, nothing was applied.

So I noticed in the bottom right, there was a red error, see the attached image. It says "Missing Closing '}' and I think, hopefully, this is what's causing the issue. NOW, the problem is I don't have any idea where this missing closing is located. It's not part of the new coding I tried to put in as it was there before I touched it. Does anyone have any idea how to find where this missing closing is? I appreciate all the help.

Error.png

Link to comment
  • Replies 10
  • Views 2.3k
  • Created
  • Last Reply

Top Posters In This Topic

  • 9 months later...
On 2/10/2023 at 9:57 AM, ViZ said:

Hey, I am having a similar issue with the missing closing '}' but can't figure out where it is. Is anyone able to help?

Screen Shot 2023-02-09 at 9.57.03 PM.png

Your code missing 2 ) symbols.

Can you send code in screenshot? I can write correct code easier

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 1 month later...

Hello @tuanphan

 

I'm experiencing something similar as well. I've copied my code below. Any help is greatly appreciated!

________

 

//CUSTOM FONTS//

@font-face {
font-family: RomieItalic;
src:
url(https://static1.squarespace.com/static/63bae38b46f01e03b915fa2c/t/64161d7c58a10453d6480ef2/1679170940526/RomieTrial-Italic.otf);
}

@font-face {
font-family: Agrandir;
src: url(https://static1.squarespace.com/static/63bae38b46f01e03b915fa2c/t/63bc79fa4bee0a7daec2dc38/1673296378202/PPAgrandir-Regular.ttf);
}

@font-face {
font-family: Bradford-Light-Italic;
src: url(https://static1.squarespace.com/static/63bae38b46f01e03b915fa2c/t/63f519f34aec2c4f002794b8/1677007347169/BradfordLLWebTrial-LightItalic.woff2);
}

//HIERARCHY FONT CHANGES//

h1 {
font-family: 'RomieItalic';
}

h2 {
font-family: 'Bradford-Light-Italic';
}

h3 {
font-family: 'Bradford-Light-Italic';
}

h4 {
font-family: 'Bradford-Light-Italic';
}

p {
font-family: 'Bradford-Light-Italic';
}

//PORTFOLIO PAGES//

h3.portfolio-title {
    font-family: 'Bradford-Light-Italic' !important;
}

.item-pagination-link .item-pagination-title {
  font-family: 'Bradford-Light-Italic';
}

.item-pagination-link .item-pagination-icon svg {width: 10px;
}

//HEADER NAVIGATION//

.header-nav, nav.header-menu-nav-list {
    font-family: Agrandir;
}

.header-title-logo img {
    visibility: hidden;
}
.shrink .header-title-logo img {
    visibility: visible;
}

@media only screen and (min-width:768px) 
div#BLOCK-.header-title-logo>.sqs-block-content:first-child {
   display: visible!important;}

//HIDDEN ON MOBILE//
@media only screen and (max-width: 768px) {#block-yui_3_17_2_1_1678742635296_50065 {display:none;
}

.sqs-block-button .sqs-block-button-element--small {font-family: Agrandir !important; color: #212E21!important;   font-size: 25px !important;   letter-spacing: 0.01em !important;   line-height: 30px !important; 
}  

.sqs-block-button .sqs-block-button-element--small: hover {opacity: .98;
}

@media only screen and (max-width: 768px) {#block-yui_3_17_2_1_1673198424087_6401 display: none;
}


@media screen and (max-width:767px)
div#block-yui_3_17_2_1_1673203832010_12702 h1{
    font-size: 40px;
}

@media only screen and (max-width: 768px) {section[data-section-id="63bb0e66f0927a3da71b10c7"] {display: none;
}


.item-pagination-title:before {
  content: "\2192";
  float: right;
  padding-left: 30px;
}

.item-pagination-icon {
  display: none;
}
    
.header-nav-folder-content{border: 1px solid black
}

.header-nav-folder-content{box-shadow: 2px 2px 10px rgba(0,0,0,0.25)
}

//Image Layout on Mobile//

@media (max-width: 800px) 
{flex-direction: column !important;
.intrinsic, .image-card-wrapper {width: 100% !important;}

.form-wrapper .field-list .field .field-element {
  background-color: transparent;
  border: 1px solid #194027;
  border-radius: 0;
}

//BORDERS//
  
section[data-section-id="63bb0e66f0927a3da71b10c7"]
{border-bottom: 1px solid black;
 border-top: 1px solid black;
 }

div#block-e42baeb5cc32bfcd1dd0 {
    border-left: 1px solid black;
}

Link to comment

(Remember to save a copy of all CSS somewhere, just for backup, before edit anything)

This code is incorrect. It missing 2 symbols { and }

and it has incorrect class name. You can remove it

image.thumb.png.0189519bdcf9fd29b02c431bdf9dacf1.png

Red box missing 2 symbols { and }. 

image.png.2fb8a4c03304693bbe8f5cad91ff6559.png

Red box should be

@media screen and (max-width:767px) {
div#block-yui_3_17_2_1_1673203832010_12702 h1{
    font-size: 40px;
}}

image.thumb.png.f48ddd19119d6ee71d9560bd66bff098.png

Similar with

image.thumb.png.26d286eebbb7292eed0c3b217ec308b0.png

it should be

@media only screen and (max-width: 768px) {
section[data-section-id="63bb0e66f0927a3da71b10c7"] {
display: none;
}
}

this code missing a class name , so you can remove it (red box)

image.png.459f2975b80ecd9ab731e7c2cb89365b.png

 

image.png

Edited by tuanphan

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 4 months later...

I am having a similar issue. Could you tell me what is wrong?

.header-nav *, nav.header-menu-nav-list * { font-family: https://static1.squarespace.com/static/64aeed8749272615dc522f91/t/64aef09acc85f7348e7502f8/1689186458385/LarosaMedium.ttf;}

h1 {font-family: 'LarosaSansMediumhttps://static1.squarespace.com/static/64aeed8749272615dc522f91/t/64aef09acc85f7348e7502f8/1689186458385/LarosaMedium.ttf';}
h2 {font-family: 'LarosaSansRegularhttps://static1.squarespace.com/static/64aeed8749272615dc522f91/t/64aef14a9816d5619f778b93/1689186634197/LarosaRegular.ttf';
h3 {font-family: 'LarosaSansRegularhttps://static1.squarespace.com/static/64aeed8749272615dc522f91/t/64aef14a9816d5619f778b93/1689186634197/LarosaRegular.ttf';}
h4 {font-family: 'LarosaSansRegularhttps://static1.squarespace.com/static/64aeed8749272615dc522f91/t/64aef14a9816d5619f778b93/1689186634197/LarosaRegular.ttf';}
p {font-family:'LarosaSansRegularhttps://static1.squarespace.com/static/64aeed8749272615dc522f91/t/64aef14a9816d5619f778b93/1689186634197/LarosaRegular.`}`

Screenshot 2023-07-26 at 12.34.08 PM.png

Link to comment
1 hour ago, fcphoto said:

Could you tell me what is wrong?

Look at the end of line 7, after LarosaRegular.

About me: I've been a SQSP User for 18 yrs. I was invited to join the Circle when it launched in 2016. I have been a Circle Leader since 2017. I don't work for Squarespace. I value honesty, transparency, diversity and good design ♥.
Work: I founded and run SF.DIGITAL, building Squarespace Extensions to supercharge your commerce website. 
Content: Views and opinions are my own. Links in my posts may refer to SF.DIGITAL products or may be affiliate links.
Forum advice is free. You can thank me by clicking one of the feedback emojis below. Coffee is optional.

Link to comment
6 hours ago, design_obi said:

Similar issue, trying to remove the footer from the homepage of my site.

Says I'm "missing the closing }"

Here's the code:

#collection-64c4169eda0cba00d9015323{
footer 
  { display: none !important;}

 

The code should be

#collection-64c4169eda0cba00d9015323 footer { 
	display: none !important;
}

Then save & reload the site

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 1 month later...

I'm having the same issue with this

 

display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    
    /*
    
      default orientation is row, for column swap commented values in lines
      below
      
      */
      
    -webkit-box-orient: vertical; /*  */
    -webkit-box-direction: normal;
    -ms-flex-direction: column; 
    flex-direction: column; 
    
    grid-gap: 0.5em;
    gap: 0.5rem;
  
    text-align: center;
    
  /* Hide home nav item on homepage */
.homepage .header-nav-item--homepage {
  display: none!important;

 @media only screen and (max-width: 640px){
#page .page-section:nth-child(1) .section-background img {opacity:0 }
#page .page-section:nth-child(1) .section-border{background:transparent!important}
#page .page-section:nth-child(1)  .section-background {
background-image: url(your-image-here);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
}https://static1.squarespace.com/static/5f9a0d000d533c769be5ab75/t/650a4e6110ee6f2770c4017d/1695174242364/Sunny+Mobile.png

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.