Gap between sections?

Store Design

Topic summary

A user encountered an unwanted gap appearing between the product section and complementary products section on their product pages.

Solution provided:

  • Navigate to Shopify Admin → Online Store → Themes → Actions → Edit Code
  • Open Asset > styles.css
  • Add the following CSS at the bottom of the file:
.product-area {
    margin-bottom: 0;
}

The CSS modification successfully removed the gap. The issue was resolved by eliminating the bottom margin from the product area element.

Summarized with AI on October 24. AI used: claude-sonnet-4-5-20250929.
1

I have a gap between two sections, it appears on my product pages between the product section and the complimentary products, I cannot see a way to remove it. Please can someone assist. my store is www.saltsista.com

image
image440×439 34.8 KB

1 Like
2

Hi @BK01

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset > styles.css and paste this at the bottow of the file:
.product-area {
    margin-bottom: 0;
}

image
image1355×480 101 KB

2 Likes
3

Thank you that worked a treat !

1 Like
4

Hi @BK01

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, please like and accept the solution.