I am using Dawn theme and the slideshow image is the perfect size on desktop, but too small on the mobile version.
I would like to increase the size of the slideshow on mobile
The site address is www.retrokingstonmerch.ca
Thank you!
Topic summary
Using the Shopify Dawn theme, the slideshow image looks right on desktop but appears too small on mobile; the requester wants a larger mobile slideshow (site: retrokingstonmerch.ca).
Suggested fix: add a CSS media query to the theme’s base.css (in Assets) that only applies on mobile (max-width: 749px) and increases the slideshow image height for the .media > img element (example value 176px, adjustable), enforced with !important. A screenshot was provided to illustrate the change. Briefly: CSS (style rules) and media queries (conditions like screen width) let you apply mobile-only styling.
Alternate view: another participant says the current mobile UI/UX looks good and no changes are needed.
Outcome: no confirmation from the requester; the thread remains open. Actionable next step is to try the mobile-only CSS and tweak the pixel height to the desired size.
1 Like
Hi @SteveT2112 !
This is PageFly - Advanced Page Builder. I would love to give you some recommendation;
Please paste this code at the bottom of base.css under assets in theme code files;
@media screen and (max-width: 749px) {
.media > img {
height: 176px !important;
}
Bro You can change px as you want.
Like this;
Best Regards;
Pagefly
oh sorry for that bt your mobile real device perfect look good UI/UX doesn’t any change required