Shopify themes, liquid, logos, and UX
I need assistance in making the product images full width on mobile.
I installed an app called "GO Product Page Gallery + Zoom," and everything looks like it should.
But there is white padding/margin beside the image on mobile. How can I make the product image be full width so the white margins are no longer there?
The website is: https://veinci.com/products/floral-choker-flower-clasp-necklace
Here's an example of how it should look:
Solved! Go to the solution
This is an accepted solution.
Hey @parthpatel05
I hope you are well and safe!!
Please use this code in CSS file
@media screen and (max-width: 750px) {
.product.product--thumbnail_slider.product--mobile-show .grid__item.product__media-wrapper {
left: -1.5rem;
width: calc(100% + 3rem);
max-width: calc(100% + 3rem);
}
}
Thanks
This is an accepted solution.
Hey @parthpatel05
I hope you are well and safe!!
Please use this code in CSS file
@media screen and (max-width: 750px) {
.product.product--thumbnail_slider.product--mobile-show .grid__item.product__media-wrapper {
left: -1.5rem;
width: calc(100% + 3rem);
max-width: calc(100% + 3rem);
}
}
Thanks
I appreciate your help Pooja. It worked perfectly.
No problem, if you need more help then let me know.
Thanks
Where I have to put this CSS code? In theme.liquid?
Hey pooja_d_92,
Can you tell me to where copy and paste this code step by step, please?
The year-end shopping spree is around the corner! Is your online store ready for the ...
By JasonH Nov 10, 2024We recently spoke with Zopi developers @Zopi about how dropshipping businesses can enha...
By JasonH Oct 23, 2024A big shout out to all of the merchants who participated in our AMA with 2H Media: Holi...
By Jacqui Oct 21, 2024