How to Increase Space Between Products in Featured Collections (Debut Theme)

[prankoyz]

Hi there!

I've searched as much as I could but didn't see a solution for my problem.

URL: https://consistent-home-delivery.myshopify.com/
Theme: Debut
Problem: I added a QTY and Add to Cart button on my featured collections page but now I want to increase the space between the add to cart button and the product not associated with it to avoid confusion. Please see attached picture.



Thank you very much!

[oscprofessional · Accepted solution]

Hello prankoyz,

Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss.liquid

.grid__item.grid__item--collection {
    padding-top: 40px !important;
}

Add this css for more design:

.grid__item--collection .btn { 
padding-top: 5px;
 }
 .grid__item.grid__item--collection { 
text-align: center;
 }
 .price.price--listing {
 text-align: center; 
align-items: center; 
}
.grid__item--collection #quantity {
    width: 30%!important;
}

[prankoyz]

Hi oscprofessional!

Thank you so much for your help! I used the 2nd code and it looks so much better now! 

[prankoyz]

[ompatel001]

Hey! In my Debut Theme, There's no file in the name of "theme.scss.liquid". So I created one & Used these codes but did not work so I deleted the newly created file & unfortunately shop shows blank page now. Please Help 

[opticalboutique]

Can you please help me with this?