Blurry Images on Mobile but Clear on Desktop – Need Help!

Store Design
, , , ,
1

Hello everyone,

I’m experiencing an issue with my store. When I view my site on desktop, the images in my slides and the text with image sections look great. However, when I switch to mobile, the images appear blurry. I’ve tried changing the images multiple times, but the problem persists. Has anyone else encountered this, and do you know how to fix it? Any advice would be greatly appreciated!

Thanks in advance!

Here is my store link : https://7968dc-f5.myshopify.com/

2

Hi,

I’m not 100% sure this will fix it but lets give it a try

find component-card.css file and find the line .card__media .media img and add add following code right before its close }

transform: translate3d(0, 0, 1px);

it will look like this after adding above code:

.card__media .media img {
    height: 100%;
    object-fit: cover;
    object-position: center center;
    width: 100%;
    transform: translate3d(0, 0, 1px);
}