Remove padding between product image and product info on collections page (Prestige Theme)

Remove padding between product image and product info on collections page (Prestige Theme)

Streccent
Excursionist
18 0 3

Hi,

 

How do i bring the product information closer to the product image on the collections page.

 

Currently there is a white gap between it.

 

Also, How do i remove the padding at the top of pages. On the collections page there is a padding between the filter bar and where the product image starts. On a product page there is a gap between the header and product image.

 

Theme: Prestige Theme

Store: arterclo.com

pass: yaifra

Screenshot 2024-11-16 at 14.39.13.png

Replies 2 (2)

LizHoang
Shopify Partner
1251 159 195

Hi @Streccent 

 

You can follow the instruction to bring the information closer to product image: 


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

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

 

.product-card {
    gap: 0px;
}

 

 

here is the result :  

LizHoang_1-1731765907625.png

 

 

To remove the Gap between header and product: 

 

- You can add this code to CSS section: 

 

@media screen and (min-width: 700px) {
    .sm\:gap-12 {
        gap: 0rem;
    }
}

.gap-6 {
    gap: 0rem;
}

 

Here is the result: 

LizHoang_0-1731766110563.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
Streccent
Excursionist
18 0 3

Hi LizHoang,

 

Thanks for your answer.