Cart images stopped displaying on smaller screens

Solved
Highlighted
New Member
2 0 1

So this is a wierd issue that I've only just noticed. Our cart product images are no longer loading. There is an empty white space where the images should be. This only happens on smaller screens & mobiles. 

I honestly can't work out why this is happening, I would really appreciate any help you can provide. This is our site - https://woodprints.co.uk you'll need to add something to the cart to the see the issue happening. 

 

This seems to be caused by this css

 

@media only screen and (max-width: 749px)
.cart-item__image {
    /* position: absolute !important; */
    overflow: hidden;
    clip: rect(0 0 0 0);
    /* height: 100px; */
    width: 100px;
    margin: -1px;
    padding: 0;
    border: 0;

I have 0 clue where this is from, it's not from my main stylesheet

0 Likes
Highlighted
Shopify Partner
1023 214 463

This is an accepted solution.

@WoodPrints 

 

Go to your theme.scss.liquid file and add following code at the end of file:

@media only screen and (max-width: 749px){
.cart-item__image {
    clip: unset !important;
    height: 60px !important;
    width: 60px !important;
}
}

Cheers,

Tejas

 

 

Shopify Expert | Skype: tejas.nadpara
- Like and Mark as an Accepted Solution if reply helpful
- Feel free to contact me on support@hexaecommerce.com regarding any help
0 Likes
Highlighted
New Member
2 0 1

Thank you so much, this has fixed the problem!! 

1 Like