Image view full width on mobile version

[NikosBat]

 Hello guys, how can I make my image to be full width on mobile version?

[kazi]

@NikosBat  Hello can you share the link?

[NikosBat]

Hello Kazi and thanks for answering, sure here is the url and password:

https://www.nistore.de/products/nistore™-winterhandschuhe, nikthe

[kazi]

@NikosBat  Put this CSS bottom of base.css

@media (max-width:749px) {

.product-media-container.constrain-height.media-fit-contain {
width: 100% !important;
}

}

[NikosBat]

Thanks for replying Kazi, that didn't work for me

[DaisyVo]

Hi @NikosBat 

I hope you are well. You can follow our instructions below:

1/ Shopify admin > Online store > Customize: https://prnt.sc/XQ6IDB99kUCd
2/ From the left menu > Theme settings > Open Custom CSS: https://prnt.sc/iDxwa8zBQ4Z-
3/ Copy the code below and paste it there

Here is the code for Step 3:

@media screen and (max-width: 768px){
ul.product__media-list {
    gap: 0 !important;
}
ul.product__media-list > li:nth-child(1) {
    margin-left: 0 !important;
}
}

 

Please let me know if it works. Thank you!

Best,
Daisy - Avada Support Team.

[NikosBat]

Hello DaisyVo, maybe you understood me wrong, I want my image view to be like this one. As you can see, the image does almost not have padding on the right and left side