Have your say in Community Polls: What was/is your greatest motivation to start your own business?
Shopify Community Downtime: The Shopify Community will be down December 5th for 15 minutes between 3pm and 4pm EST. Thank you for your understanding.

How to remove padding between sections on homepage - EMPIRE Theme

Solved

How to remove padding between sections on homepage - EMPIRE Theme

racegermanusa
Tourist
6 0 1

Looking to remove the padding between sections added on the empire theme.  Not sure why they are so large. In this scenario between the banner and the feature products collection.

 

Thanks in advance

 

Screenshot 2024-11-21 at 7.42.35 AM.png

Accepted Solution (1)
LizHoang
Shopify Partner
245 31 56

This is an accepted solution.

Hi @racegermanusa 

 

You can follow the instruction here to remove the padding : 

1. Go to Shopify > Theme > Customize > Settings > Custom CSS

2. Copy this code and paste to the section > save

 

@media screen and (min-width: 1024px) {
    .home-section--title {
        margin-top: 1.25rem;
    }
}

@media screen and (min-width: 860px) {
    .home-section--title {
        margin-bottom: 1.25rem;
    }
}

 

Here is the result: 

LizHoang_0-1732196253726.png

 

Please let us know if our reply is helpful by giving it a Like or marking it as a Solution!

Check our Joy Rewards & Loyalty Program

View solution in original post

Replies 5 (5)

topnewyork
Globetrotter
748 124 139

Hello,

Please share "Store URL".

Thanks!

Need a Shopify developer?
Hire us at Top New York Web Design
For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
Try Big Bulk Discount To Boost Your Store Sales with Volume/Tier Discount
racegermanusa
Tourist
6 0 1

www.racegerman.com or testrg2022.myshopify.com either work. 

LizHoang
Shopify Partner
245 31 56

This is an accepted solution.

Hi @racegermanusa 

 

You can follow the instruction here to remove the padding : 

1. Go to Shopify > Theme > Customize > Settings > Custom CSS

2. Copy this code and paste to the section > save

 

@media screen and (min-width: 1024px) {
    .home-section--title {
        margin-top: 1.25rem;
    }
}

@media screen and (min-width: 860px) {
    .home-section--title {
        margin-bottom: 1.25rem;
    }
}

 

Here is the result: 

LizHoang_0-1732196253726.png

 

Please let us know if our reply is helpful by giving it a Like or marking it as a Solution!

Check our Joy Rewards & Loyalty Program
racegermanusa
Tourist
6 0 1

Thank you! This worked great.

racegermanusa
Tourist
6 0 1

Is it possible to fix this for mobile view too?