How can I make image sizes responsive on collection pages?

[Gerardlopez]

hi, I can’t seem to mantain the size of my images in the collection pages.

They have borders depending on the screensize, can I make them responsive so they mantain the original proportions?

Here they look ok

but in full screen they look like this

And like this in mobile

https://reclaimed-vessels.myshopify.com/

thanks!

[KetanKumar]

@Gerardlopez

Sorry you are facing this issue, it would be my pleasure to help you.

your store password protect, can you please share us ,
I will check out the issue and provide you a solution here.

[Gerardlopez]

the password is uyupri

thanks!!

gerard x

[KetanKumar]

@Gerardlopez

thanks for URL

please try this code.

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.product--wrapper {max-width: 100% !important;}
.product--image {max-width: 100% !important; max-height: 100% !important;}

[Gerardlopez]

hi!

it’s still happening as soon as we change the screen size

[Gerardlopez]

@KetanKumar is it possible to fix it?

Thank you!