Jump to content

Lost main page border after upgrade

Recommended Posts

I just upgraded my website to the new Fluid Engine, and doing so seems to have killed the white background I had on my website's home page. What I want is for the same white background on my blog page and About page to be present on the home page (and all other pages). Not sure how to get back to that though. 

Here is the custom CSS (which I don't fully understand) being used:
 

/* reduce bottom margin of headers */
h1 :not(.blog-tile), h2 {
 margin-bottom: -15px !important;
}


/* customize blog bottom margin */
.blog-title {
  margin-bottom: 4px !important;
}


/* mobile nav font */
.header-menu-nav-item a {
    font-family: 'Fuzzy Bubbles Bold' !important;
    font-size: 30px;
    color: #00557a !important; 
}


/* set homepage wrapper details */ 
section[data-section-id="6193328782fcf92d7a4532ab"] .content-wrapper .content {
  background: #f9fafb;
  border-style: solid; 
  border-width: 1px; 
  border-color: gray;
  padding: 20px 40px 60px 40px;
  max-width: 800px;
}


/* set About wrapper details */ 
section[data-section-id="61a91d5a71d3ac0135447767"] .content-wrapper .content {
  background: #f9fafb;
  border-style: solid; 
  border-width: 1px; 
  border-color: gray;
  padding: 20px 40px;
  max-width: 800px;
}


/* set blog main page wrapper details */
.blog-single-column.collection-content-wrapper {
  background: #f9fafb;
  border-style: solid; 
  border-width: 1px; 
  border-color: gray;
  padding: 20px 40px;
  margin: 40px auto;
  width: 90%;
  max-width: 800px;
}


/* set individual blog post wrapper details */
.blog-item-wrapper {
  background: #f9fafb;
  border-style: solid; 
  border-width: 1px; 
  border-color: gray;
  margin: 40px auto;
  padding: 20px 40px;
  max-width: 800px;
}

/* allows text to span wrapper in individual blog post */
.blog-item-inner-wrapper {
  width: 100% !important;
} 



/* hacky way of getting paragraph breaks to show on blog main page */
.blog-single-column .blog-excerpt p {
  margin:0 0 15px 0;
}

Any help would be much appreciated!

Link to comment
  • Replies 3
  • Views 153
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Ah, I got the white wrapper to reappear on the Home page by changing the section ID:

/* set homepage wrapper details */ 
section[data-section-id="63aef4b07e2b647db6afd610"] .content-wrapper .content {
  background: #f9fafb;
  border-style: solid; 
  border-width: 1px; 
  border-color: gray;
  padding: 20px 40px 60px 40px;
  max-width: 800px;
}

However, the text is now wrapping on the Home page in a funky way, or has restrictive margins. The text on the About page is just the way I want it, but I have basically the exact same CSS code for my About page:

/* set About wrapper details */ 
section[data-section-id="61a91d5a71d3ac0135447767"] .content-wrapper .content {
  background: #f9fafb;
  border-style: solid; 
  border-width: 1px; 
  border-color: gray;
  padding: 20px 40px;
  max-width: 800px;
}

Why does the text have different wrapping/margins on these pages, and how can I get the Home page to behave like the About page? 

Edited by KRemington
Clarity
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.