How to display only one image on mobile product card?

[NaomiNN]

Hello,

On mobile on my product card a little part of the second image is showing.

i want to show only one image and not the two of them like that. Can someone help me ?

Shop url :https://prettyprettyplease.fr

password: Naomi

[ZenoPageBuilder]

Hello @NaomiNN

In Shopify Admin, you can go to edit theme code, open file base.css and add this code at the bottom

.product__media-list .product__media-item {
    width: 100%;
    margin-left: 0;
}

The result

Hope it helps!

[INA_MSWEB]

Hi @NaomiNN

I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

Please add this css in your bottom of the base.css file:

.product .product__media-list .product__media-item {width: 100%; margin-left: 0;}

Regards,

San

[NaomiNN]

Hello, thank you for your reply.

i tried the code it works for the first photo but not for the second. It’s not centered and I can see a little part of the first photo.

[NaomiNN]

Hello, thank you for your reply.

i tried the code it works for the first photo but not for the second. It’s not centered and I can see a little part of the first photo.

[dmwwebartisan]

@NaomiNN

Please add the following CSS code to your assets/section-main-product.css bottom of the file.

@media screen and (max-width: 749px){
.product__media-list .product__media-item {width: 100% !important;}
}

Thanks!

[NaomiNN]

Hello, it’s not working.