So I’ve been searching the web and shopify help for this and it looks like NO ONE has any answers to this.
On mobile, the banner AND slideshow are cropped. They look perfect on the computer. I saw another website and want I would like it to look like that (the pink website).
I’ve tried:
@media only screen and (min-width: 750px) {
.hero {
height: 100%;
}
.hero__image {
object-fit: contain;
}
}
which was something I found repeatedly from similar questions but it squishes my image and distorts it instead of just zooming out. It also only applied to my slideshow. I found a post that had a lot of coding to fix it but I believe Shopify had updated since so the some of the places the person posted does not apply to me/I can’t find it in the coding. I’m new to shopify and can not code. Please help.