Image Banner on Mobile not Showing Full Photo as Shown on Desktop

[magneticprints]

Hi, I am having trouble with my image banner on mobile. For desktop the full photo fits in the image banner, but for mobile the top, bottom and sides are chopped off. The full image is not being used in the banner. I have tried adding code I found on numerous community pages. but nothing is working for me. Can someone please help

 

 

[LuffyOnePiece]

Hi @magneticprints ,

Can you please send me preview url of the store?

Thank you

[Hardik2903]

@magneticprints  Please provide website url

[magneticprints]

Sure. magneticprints.com.au

[LuffyOnePiece · Accepted solution]

Hi @magneticprints ,

Can you please try adding below css to the base.css file?

@media (max-width: 767px) {
    .animate--fixed > img:not(.zoom):not(.deferred-media__poster-button) {
        position: unset;
        height: -webkit-fill-available;
    }
}

If you require further help to optimize or customize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

Best Regards,
LuffyOnePiece

[magneticprints]

Thank you LuffyOnePiece! That works brilliantly!