Help Adjust Banner Size For Mobile

[LuizaSMC23]

Hi, I have entered two images for desktop and mobile version on the frontpages’s banner, for desktop it all worked well, but for mobile the image is cut and I don’t know how to make all the image to be displayed ( there is two images for desktop and other two for mobile version, they have different sizes for each version)

In case someone can help me, here is the link: https://shoptarz.com/

Thanks in advance

[Dan-From-Ryviu]

Hi @LuizaSMC23

You can add 2 slide sections, then add code to hide mobile’s section on desktop and vice versa

Add this code to Custom CSS of desktop’s section

@media (max-width: 767px) {
.slide { display: none; }
}

Mobile’s section

@media (min-width: 768px) {
.slide { display: none; }
}

[LuizaSMC23]

Hello! I paste the code but the image is still cut, please see below on the first image how I see on live and on the second image how I see on shopify edit page, the image should be appearing in one piece, I think it would just adjust the height to automatic according to the height of the image but I don’t how to code it

How I see on shopify:

[Dan-From-Ryviu]

Check if your slide has this option

[LuizaSMC23]

Hello!

I don’t have this option, only the option “disable full width”, when this option is marked the slide appears with white spaces on both sides for desktop and mobile version for any slide size, just like this: