hey guys! so im in the middle of building my website and as im editing on desktop it looks good, but when I view it on my phone the images on the slideshow cut off.. can someone help?
this is the link :
hey guys! so im in the middle of building my website and as im editing on desktop it looks good, but when I view it on my phone the images on the slideshow cut off.. can someone help?
this is the link :
I’d appreciate it!
Hi @felipe10221 ,
Layoutbase here, we recommend the following fix:
@media screen and (max-width: 749px) {
.banner__media img {
position: static!important;
height: auto!important;
}
}
Note: When you update this code, the height of the images will NOT be equal. You will need to manually change the size of images to the same. You should be able to do this through Shopify Theme Editor.
Hope you find this suggestion useful!
Best regards,
Layoutbase - Homepage & Blog page-builder
Thank you very much! I’ll try it out
Ok so it definitely did work! Now is there a way I can remove that extra space at the bottom? So it shows just the image and not the extra space?
Hello Felipe10221, did you find a fix for the extra space under the image? If so, I’d really appreciate it if you could share that with me please. Thanks
Hello! I did not find a solution for that.
Hellp @felipe10221 & @ChantelW ,
Sorry for the delayed reply, our staff was on holiday in the past month. Let’s try adding some css, here are the steps;
@media screen and (max-width: 749px){
.banner--small.banner--mobile-bottom:not(.banner--adapt) .banner__media, .banner--small.banner--stacked:not(.banner--mobile-bottom):not(.banner--adapt) > .banner__media {
height: auto!important;
}
}
Sincerely,
Layoutbase