Debut Theme Header Whitespace

[VintageCapital]

Hi i'm currently having an issue with theme css code where i had looked up a solution on the discussion forms that would remove the white border between the content on my page and the header. I ended up finding the solution with this bit of code that i placed in the bottom of my theme.scss.liquid
.main-content {
padding-top: 0px;
}
However I was under the impression that this would just effect my home page but it actually changed every page. This is not quite the effect i was after and has made everything quite squished on my other pages. I was wondering if instead of .main-content there was a homepage element where i could just edit that.

For reference my store is vintagecapital.shop

Thanks.

[oscprofessional]

Hello VintageCapital,

Please share your site url.

[VintageCapital]

https://vintagecapital.shop/

[oscprofessional · Accepted solution]

Hello VintageCapital,
Replace that code which is

.main-content {
    padding-top: 0px;
}

with this code

.template-index .main-content {
    padding-top: 0px;
}

Now only your home page having applied changes.

[VintageCapital]

Actually a genius. Thanks so much

[alejandralog]

Hi! I have the same problem and I've tried all the codes I found.
Can you please help?

For reference my store is babyinc.com.mx

Thanks.

[oscprofessional]

Hello alejandralog,
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss.liquid

.template-index .main-content {
    padding-top: 0px !important;
}
#shopify-section-16081312039445e297 {
    padding-top: 0px !important;
}

[alejandralog]

Awesome! Thank you so much!

[entree]

Hi any chance you can help me please! Ive tried every single code I found online and the white border is still not going away. for reference here's my store afroabstracts.com