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

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

Sohayl67
Explorer
89 0 21

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/

Reply 1 (1)

kevinkarma55
Shopify Partner
101 11 11

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);
}



Please remember to Like & Mark Solution to the post if it helped you.
Thanks !
If you'd like to support me, you can Buy Me a Coffee
Need help with anything related to Frontend?
Checkout kevinkarma.me