Solved

White space above announcement bar

Fabian_weldon
Pathfinder
142 0 28

Looking at my website there seems to be some white space above the announcement bar for some reason. 

I have looked at solutions but none have worked.

Thank you in advance

 

Screenshot 2021-01-21 at 21.51.33.png

Accepted Solution (1)

PeanutButter
Shopify Partner
385 67 181

This is an accepted solution.

Hi @Fabian_weldon, problem comes from this css line:

.template-index .index-sections .shopify-section {
    margin-top: 50px !important;
}

I believe this is custom code added to timber.scss.liquid to make the margin between sections in the homepage smaller. 
Problem is that this is adding a margin to the first section, and therefore the white-space

I think that if you remove the !important from the css line you will fix the white-space issue and also maintain your current margin between section. The proper code would be:

.template-index .index-sections .shopify-section {
    margin-top: 50px;
}

 

Peanut Butter Collective | Shopify Experts
- Was my reply helpful? Please Like and Accept Solution.
- Want to customize and improve your store? Hire us.
- Feel free to contact me us hello@peanutbutter.es

View solution in original post

Replies 4 (4)

PeanutButter
Shopify Partner
385 67 181

This is an accepted solution.

Hi @Fabian_weldon, problem comes from this css line:

.template-index .index-sections .shopify-section {
    margin-top: 50px !important;
}

I believe this is custom code added to timber.scss.liquid to make the margin between sections in the homepage smaller. 
Problem is that this is adding a margin to the first section, and therefore the white-space

I think that if you remove the !important from the css line you will fix the white-space issue and also maintain your current margin between section. The proper code would be:

.template-index .index-sections .shopify-section {
    margin-top: 50px;
}

 

Peanut Butter Collective | Shopify Experts
- Was my reply helpful? Please Like and Accept Solution.
- Want to customize and improve your store? Hire us.
- Feel free to contact me us hello@peanutbutter.es
PeanutButter
Shopify Partner
385 67 181

Just for reference, I see that you added this code after being suggested here https://community.shopify.com/c/Shopify-Design/remove-padding-from-custom-html/m-p/1029947#M260119

Peanut Butter Collective | Shopify Experts
- Was my reply helpful? Please Like and Accept Solution.
- Want to customize and improve your store? Hire us.
- Feel free to contact me us hello@peanutbutter.es
Fabian_weldon
Pathfinder
142 0 28

that worked perfectly. thank you so much for your help

 

vcole1290
New Member
4 0 0

Hi -- Can you help me with my page? I seem to be having a similar issue. A white bar above the announcement banner. Nothing else has worked. www.minershop.com