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 5
  • 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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.