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

Solved
prankoyz
Tourist
10 0 0

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.

Screenshot 2020-04-15 07.29.02.png

Thank you very much!

0 Likes

This is an accepted solution.

Hello ,

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;
}
If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
prankoyz
Tourist
10 0 0

Hi oscprofessional!

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

0 Likes
prankoyz
Tourist
10 0 0

Screenshot 2020-04-18 05.18.22.png

0 Likes
ompatel001
New Member
1 0 0

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 

0 Likes