How do I fix my mobile image banners that won't stretch properly?

Store Design
, ,
1

Hello, I have this code below for my image banners on Dawn theme to have my first image show on desktop, and second image only on mobile. When I view the tablet version the image banner gets cut off and resizes the image. I want the image to stay the same size on tablet.

See how the image banner gets cut off as the screen size increases?

mobile.PNG
mobile.PNG463×558 154 KB

tablet.PNG
tablet.PNG592×553 258 KB

question33.PNG
question33.PNG418×390 7.69 KB

Here’s my store:

https://try-wonder-boutique.myshopify.com/

Password: wonderboutique

Thank you so much in advance I’ll vote for you :heart: :slightly_smiling_face:

-Kirsten

2

Hi,

go to assets > section-image-banner.css

and line 50 or look for below style and change to 65rem

.banner–large.banner–mobile-bottom:not(.banner–adapt) .banner__media, .banner–large.banner–stacked:not(.banner–mobile-bottom):not(.banner–adapt)>.banner__media {
height:65rem;

}

Hope that will work