How to remove/ reduce whitespace in featured collections on home page

Solved
NUSASWIM
Tourist
4 0 2

Hi, this code doesn't work for me. I'm on the Narrative theme and wish to reduce the white space immediately below my featured collection on my homepage.

Can you/anyone help please?

 

dmwwebartisan
Shopify Partner
9262 2143 2916

@NUSASWIM 

Please share your store URL.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes
KetanKumar
Shopify Partner
23454 2357 8631

@NUSASWIM 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!
Thanks for your good question.

Please share your site URL,

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
NUSASWIM
Tourist
4 0 2

Thanks it’s nusaswim.com

dmwwebartisan
Shopify Partner
9262 2143 2916

@NUSASWIM 

Please add the following code at the bottom of your assets/theme.scss.liquid file.

@media only screen and (min-width: 750px){
.card__wrapper {margin-bottom: 0px !important;}
.featured-collection .card-list {margin-bottom: 0px !important;}
.featured-collection {padding: 30px 0 !important;}
.featured-collection__heading {margin-bottom: 30px !important;}
}
If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes
NUSASWIM
Tourist
4 0 2

@dmwwebartisan 

Thank you, that seems to have reduced the white space on the web view but hasn't made a difference on the mobile view. Could you let me know what code needs adding to remove the gap in mobile view please?

0 Likes
dmwwebartisan
Shopify Partner
9262 2143 2916

@NUSASWIM 

Please add the following code at the bottom of your assets/theme.scss.liquid file.

@media only screen and (max-width: 749px){
.card__wrapper {margin-bottom: 0px !important;}
.featured-collection .card-list {margin-bottom: 0px !important;}
.featured-collection {padding: 30px 0 !important;}
.featured-collection__heading {margin-bottom: 30px !important;}
}

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
NUSASWIM
Tourist
4 0 2

Thank you @dmwwebartisan that's worked perfectly!

0 Likes