Delete space between header and blogpost / blogpost and footer

Store Design
, , , ,

Topic summary

A user seeks to remove unwanted white space appearing between the header and blog post content, as well as between the blog post and footer on their Shopify store. They provide screenshots highlighting the problematic spacing areas.

Store Details Provided:

  • Store URL and password (“sheest”) shared with multiple helpers for direct access
  • Issue visible on a specific blog post page

Solutions Offered:

Two CSS-based fixes were proposed:

  1. First solution: Add CSS to theme.css file targeting .scroll-trigger.animate--slide-in .article-template__back.element-margin with margin: 0

  2. Second solution (accepted): Add CSS to base.css file:

    • Target article.article-template .page-width with margin: auto!important
    • Target .article-template__back with margin: auto!important and padding-top: 20px!important

Resolution:
The user confirmed the second solution worked successfully, resolving the spacing issues. The discussion is now closed with the problem solved.

Summarized with AI on November 15. AI used: claude-sonnet-4-5-20250929.
1

Hello everyone

I need some help with deleting space between header and blogpost / blogpost and footer. I have attached two photos showing each red circle part (saying deleting white section). Thanks for it!!

캡처2.JPG
캡처2.JPG1585×443 41.9 KB

캡처.JPG
캡처.JPG1519×297 28 KB

1 Like
2

Hey @ingeon

Could you please provide your Store URL and, if applicable, the Password too? Your cooperation is greatly appreciated!

Best Regards,
Moeed

3

Hello There,
Please share your store URL and Password.
So that I will check and let you know the exact solution here.

4

Hello @Moeed

Thanks for this. This is the store URL, and Password is sheest

https://0ceb19.myshopify.com/blogs/news/%EB%B9%84%EC%A3%BC%EC%96%BC%EB%A8%B8%EC%B2%9C%EB%8B%A4%EC%9D%B4%EC%A7%95vmd-%EC%84%A0%EB%91%90%EC%A3%BC%EC%9E%90-%EC%8A%A4%ED%83%80%EC%8A%A4-%EC%9D%B8%ED%84%B0%EB%B7%B0

5

Hello ZestardTech

This is URL and password >> sheest

https://0ceb19.myshopify.com/blogs/news/%EB%B9%84%EC%A3%BC%EC%96%BC%EB%A8%B8%EC%B2%9C%EB%8B%A4%EC%9D%B4%EC%A7%95vmd-%EC%84%A0%EB%91%90%EC%A3%BC%EC%9E%90-%EC%8A%A4%ED%83%80%EC%8A%A4-%EC%9D%B8%ED%84%B0%EB%B7%B0

1 Like
6

Hello Moeed

This is URL and password >> sheest

https://0ceb19.myshopify.com/blogs/news/%EB%B9%84%EC%A3%BC%EC%96%BC%EB%A8%B8%EC%B2%9C%EB%8B%A4%EC%9D%B4%EC%A7%95vmd-%EC%84%A0%EB%91%90%EC%A3%BC%EC%9E%90-%EC%8A%A4%ED%83%80%EC%8A%A4-%EC%9D%B8%ED%84%B0%EB%B7%B0

7

Hello Ingeon,

There is an issue with margin which is added on article. kindly put below css on theme.css .

“.article-template__back.element-margin-top.center.scroll-trigger.animate–slide-in { margin: 0; }”
Let me know if you need any other help. i will help your for that.

Thank you

8

Hello There,

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset > base.css and paste this at the Bottom of the file:
article.article-template .page-width{
margin: auto!important;
}
.article-template__back {
margin: auto!important;
padding-top: 20px!important;
}

ZestardTech_0-1699362543430.png
ZestardTech_0-1699362543430.png1908×573 27.8 KB

ZestardTech_1-1699362552239.png
ZestardTech_1-1699362552239.png1731×573 72.5 KB

1 Like
9

Dear @ZestardTech

Thank you for the solution. it works well !!!

1 Like
10

Thank you for your response. It’s good to know that it’s worked for you. Kindly feel free to get back to me if you need any further assistance.
If helpful then please Like and Accept Solution.

1 Like