Carousel product cards are different sizes

[TrendBlend]

Hello, I’m trying to code a carousel for my product cards, but there is a problem. All cards should have the same width/height but some are showing smaller than others. Code: Jan 04 12:07 PM - Codeshare URL: Wall Art – Transform Your Space with Style and Elegance – InteriorGlows

[LizHoang]

Hi @TrendBlend

You can follow this instruction:

1. Go to Shopify > Theme > Customize

2. Copy and paste this code on Theme settings > Custom CSS section

.card {
    min-height: 360px;
}

Here is the result :

I hope it helps

Liz

[TrendBlend]

Hello @LizHoang Thanks man! Do you by any chance also know how to add the same amount of padding on the sides of the carousel for both mobile and desktop as the middle padding is?

so add this padding on the left side and right side without messing up the carousel for mobile and desktop

[LizHoang]

Hi @TrendBlend

You can try this code :

.card__media {
    margin: 20px !important;
    width: calc(100% - 40px) !important;
}

[TrendBlend]

Hello @LizHoang , that changes nothing for me. What I want to achieve:
I want the padding on the left&right side of the cards to be the same as the padding in between the cards for both mobile and desktop.

Padding in between is the same but there is no padding on the left and right side.