I am unable to see my product images on mobile version. My website is aromaticaparfums.com
Topic summary
A user reports that product images are not displaying on the mobile version of their Shopify store (aromaticaparfum.com).
Solutions Proposed:
Two community members offered CSS fixes to resolve the mobile display issue:
- Solution 1: Add CSS code to the
assets > stylesheet.cssfile targeting grid blocks with a max-width media query of 980px - Solution 2: Navigate to Online Store > Themes > Customize > Theme settings > Custom CSS and insert CSS targeting screens with max-width of 749px, specifically addressing product section images and slider float properties
Both solutions involve adding custom CSS media queries to adjust image display behavior on mobile devices. The discussion includes code snippets and screenshots to guide implementation.
Status: The issue remains unresolved pending the original poster’s implementation and feedback on the suggested fixes.
Hello @aromaticaparfum put this css in assets > stylesheet.css
@media screen and (max-width: 980px) {
.gridlock .row .desktop-12 {
width: 100%;
}
}
Please go to Online Store > Themes > Customize > Theme settings > Custom CSS, add this code, and save
@media (max-width: 749px) {
.product__section-images #slider {
float: unset !important;
}
}

