How to Get Hero/Slideshow To Scale Instead of Crop For Mobile

Technical Q&A
1

Hello,

I am wondering how to fix an issue I am having with my slideshow image on the top of my homepage. It looks good on desktop for the most part, but on mobile part of the image is cropped out. I’d prefer it to scale so it fits the whole image in mobile, or at least more of the image. I’ve included an image of the issue below.

The site url is: https://curator-contact.myshopify.com/ and the password is: krom

imageIssue.JPG
imageIssue.JPG576×866 27.6 KB

2

Hello, @hadrianschilla

Welcome to the Shopify Community.

Please Go to Online Store → Themes → Edit code → Assets → theme.scss.liquid and paste this code at the end of this file.

@media only screen and (max-width: 450px) {
.hero {
    background-size: contain;
}
}