How to reduce the section breaks on my Home Page?

Store Design
,
1

https://j3bqgp-st.myshopify.com/?pb=0

As you can see the breaks between each section are pretty large. How can I reduce them?

2

Hi @Youngerme

I think your theme support configure the space outer. You should find it before do the code override.

If you want to do the code override, you can use this css code:

media (min-width: 45em) {
    .section {
        margin: 30px;
    }
}
3

Hi @Youngerme

  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.liquid file
  3. In theme.liquid, paste the below code before

If my reply is helpful, kindly click like and mark it as an accepted solution.
Thanks!

Use our Big Bulk Discount app to boost your sales!(https://apps.shopify.com/big-bulk-discount). Easy to set up and perfect for attracting more customers with bulk discounts. Try it now and watch your revenue grow!

4

Hello @Youngerme ,

Here are the steps to apply the necessary changes in your Shopify store:

  1. In your Shopify Admin, navigate to Online Store > Themes > Actions > Edit Code.
  2. Locate Asset > base.css and paste the following code at the bottom of the file:
@media (min-width: 45em) {
    .section {
        margin: calc(var(--space-outer) * 1) 0 !important;
    }
}

Or

@media (min-width: 45em) {
   .section {
    margin:5rem 0 !important;
}
}

ZestardTech_0-1745843706209.png
ZestardTech_0-1745843706209.png1074×818 307 KB

Let me know if you need further assistance!