Different images for desktop and mobile view

[mjcmjp]

I'm trying to display different images for mobile and desktop view with the dawn theme but when i preview my store it just puts the 2 images side by side. Any ideas how to fix this?

[DrewOswald · Accepted solution]

An easy way I accomplish this is by using two ‘Image Banner’ sections—one is hidden on desktop, and the other is hidden on mobile.

 

Hide on mobile

@media screen and (max-width: 749px) {
  {
    display: none;
  }
}

 Hide on desktop

@media screen and (min-width: 750px) {
  {
    display: none;
  }
}

[mjcmjp]

Omg this has finally worked thank you so much I’ve been trying for weeks!