All things Shopify and commerce
I have two image banners that dont look correct on mobile.
1) The first image is cut off. I have added this code to use a different image for mobile, as well as reduce the button size. However the image is still cut off. I want the image for mobile to be square- like 360 x360 px
This is the code I have entered:
.banner__media:first-child {
width: 100%;
}
.banner__media + .banner__media {
display: none;
}
@media screen and (max-width: 760px) {
.banner__media:first-child {
display: none;
}
.banner__media + .banner__media {
width: 100%;
display: block !important;
}
}
@media screen and (max-width: 760px) {
.banner--content-align-mobile-center .banner__buttons--multiple > * {
min-width: 4rem !important;
padding: 0 2.5rem !important;
}
}
2) I want to also change the size of the image on mobile for this image banner as well. Its too small on mobile. I would also like it to be 360 x 360 px
If anyone can help- I would really appreciate it 🙂
Find Global Growth Opportunities For Your Business with Shopify AcademyLearn how to exp...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025Expand into selling wholesale with Shopify Academy’s learning path, B2B on Shopify: Lau...
By Shopify Jan 28, 2025