Hi, I am trying to make my slideshow fit in the mobile version. It fits well in the desktop version. Any help would be greatly appreciated!
Website: https://ea3999-2.myshopify.com/
You can do that by adding those CSS code at the bottom of your base.css file
@media screen and (max-width: 749px) {
.banner__content { position: absolute !important; }
.banner__media { position: relative !important; }
.media>img {
position: relative !important;
object-fit: contain !important;
}
}
Hello @letitshine ,
You can try to follow these steps:
Go to Online Store → Themes → Actions → Edit code
Go to Assets folder → base.css file or theme.scss.liquid file
Add this following code at the bottom of page:
@media (max-width: 768px) {
.slideshow-container {
width: 100%;
}
}
Save and preview
Hope this can help.
Transcy
1 Like
Hi! Thank you for your help with this!
@Dan-From-Ryviu Ok now I am running into this problem…I can see the change on the mobile view in my admin account but when I actually try to view the live site on mobile, it has not changed. Any suggestions?
Thank you for your help! Sadly this one did not work for me.
Try to clear browser cache of your device
@Dan-From-Ryviu So I have found the issue. It seems this problem is only happening in the safari mobile view. All other browsers are working fine. Is there any way to fix this?