I just started using Shopify and I’m wondering is it possible to make image banner responsive and to fit screen size on all devices? I’m using Dawn theme. I tried with some additional css settings but it always ends up with overlapping sections. Thanks!
You can add 2 separate image banner sections and then add those codes to make them appear separately for mobile and desktop and add separate images for each device.
Add this code to Custom CSS code of the section that you want to hide on the mobile.
@media (max-width: 749px) {
.banner {
display: none !important;
}
}
Add this code to the Banner section you want to hide on the desktop.
@media (min-width: 768px) {
.banner {
display: none;
}
}