Header Code Injection Adding Extra Padding

Site URL: https://theaboutherpodcast.squarespace.com/

Hi there! 

When I add a simple <div> tag to my header code, I'm getting some extra padding added to all my pages. When I remove the code, the padding is not there. It only happens in the first container/section on the page. Any thoughts? Here's my code I injected in the header:

<div class="logo-title-container">
  <div class="logo-title">
 <a href="/home"><h1>
   Abigail O’Neel
</h1>
<h4>
  <em>ministry wife, podcast host, &amp; bible teacher</em>
   </h4></a>
  </div>
    </div>

Here's a screenshot.

Since the site is already live, I've put some custom CSS on every page to temporarily fix the issue, but I'd like to try to figure out a universal fix.

Your code is invalid. Try this new code

<div class="logo-title-container">
  <div class="logo-title">
    <h1><a href="/home">Abigail O’Neel</a></h1>
    <h4><em>ministry wife, podcast host, &amp; bible teacher</em></h4>
  </div>
</div>

Hi hope this is the right place to post this

I added this code into the universal custom css to remove header height for aesthetic purposes. See first image for reference. 

Quote

.page-section:nth-child(1) {padding-top:0!important}

https://thomsonscooterclub.com/

However, for one specific page, i do not want this change to apply. Is there anyway i can add a code into that specific page's Page Header Code Injection to prevent this? Below is a picture of the said page:

https://thomsonscooterclub.com/shop

15 hours ago, mmyeah said:

Hi hope this is the right place to post this

I added this code into the universal custom css to remove header height for aesthetic purposes. See first image for reference. 

https://thomsonscooterclub.com/

However, for one specific page, i do not want this change to apply. Is there anyway i can add a code into that specific page's Page Header Code Injection to prevent this? Below is a picture of the said page:

https://thomsonscooterclub.com/shop

 

Change your code

.page-section:nth-child(1) {
    padding-top: 0 !important;
}

to this

body:not([class*="type-products"]) .page-section:nth-child(1) {
    padding-top: 0 !important;
}

Thank you so much!