Shopify themes, liquid, logos, and UX
We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more
To clarify, the images for the hero banner when looking at it from pc and mobile is different, where the mobile version the image is cropped to fit
how do i make it such that the image is just shrunk instead so it keeps the structure/integrity of the image/video?
Thanks for clarifying! To keep the full structure of the image/video on both desktop and mobile (instead of it being cropped), you’ll want to adjust the CSS so the media scales down rather than covering the area.
Look for the section’s background settings or custom CSS, and try changing background-size: cover; to background-size: contain;.
Let me know your theme name and how your hero is set up (image background or inline media), and I can give you the exact fix.
thanks for the response!
changing it to contain works for on pc, but on mobile it looks like this
theme is dwell
hero is set up as image background if im not wrong (im not so sure)