Change spacing between product image on product page

[culley62]

I need to remove the spacing between the images on my product pages so that you cannot see part of the next image on the sides. I highlighted the spacing which need increasing with a green line in my image. This issue is only on mobile version!

[culley62]

www.lungtank.com

[tim]

I'd scroll down to the "Custom CSS" setting of this section and paste this code:

.product__media-list.slider--mobile {
  scroll-padding-left: 0;
}

.product__media-list.slider--mobile .slider__slide {
  width: 100%;
}

[GTLOfficial]

Hello @culley62 
Go to online store ----> themes ----> actions ----> edit code ----> base.css
add this code at the end of the file and save.

@media screen and (max-width: 749px) {
.grid--peek.slider .grid__item:first-of-type {
margin-right: 1.5rem !important;
}
}

result

If this was helpful, hit the like button and accept the solution.
Thanks