How to adjust mobile slideshow with code

Hi guys,

I have a slideshow as the first section on my homepage. I have used the below custom code to shorten the length of the slideshow on mobile view.

//Decrease slideshow height on mobile
@media screen and (max-width:767px) {
.user-items-list-banner-slideshow {
    height: 50vh !important;
}
}

This has worked well, however I was wondering if a code can be used to resize/adjust the placement of the images on mobile view only? The slideshow images look great on desktop, but they're only showing a fraction/zoomed in on mobile. I will attach screenshots for reference. Thanks!

site: https://threadsonline.co.uk/

password: welcome

4 hours ago, threadsonline said:

Hi guys,

I have a slideshow as the first section on my homepage. I have used the below custom code to shorten the length of the slideshow on mobile view.

 

//Decrease slideshow height on mobile
@media screen and (max-width:767px) {
.user-items-list-banner-slideshow {
    height: 50vh !important;
}
}

 

This has worked well, however I was wondering if a code can be used to resize/adjust the placement of the images on mobile view only? The slideshow images look great on desktop, but they're only showing a fraction/zoomed in on mobile. I will attach screenshots for reference. Thanks!

site: https://threadsonline.co.uk/

password: welcome

Try adding Custom Css

@media only screen and (min-width: 767px) {
  .user-items-list-banner-slideshow .list-slideshow-image {
    height: auto !important;
  }
}

The second approach we can try is adding new section for image on mobile then we use CSS to hide it on desktop view

7 hours ago, Beyondspace said:

Try adding Custom Css

@media only screen and (min-width: 767px) {
  .user-items-list-banner-slideshow .list-slideshow-image {
    height: auto !important;
  }
}

The second approach we can try is adding new section for image on mobile then we use CSS to hide it on desktop view

Hiya, thanks for your css suggestion. Unfortunately this didn't work properly for me but i went with the second approach (not sure why I didn't think of just doing that in the first place!) thanks!