Need to force gallery slideshow to fit on smaller mobile screens

Site URL: http://www.1worldprint.co.uk

Hi, I have a slight issue with the mobile version of our website and i'm sure there is some CSS that might be able to fix it.

http://www.1worldprint.co.uk/

The sliders on the front page on desktop are fine and on my iPhone 8 Plus, i have managed to make it fit within the borders but with smaller phones the text doesn't fit. It there is a way to force the gallery to a certain width on mobiles. I have attached some images to give you the idea as well.

Thanks for any help.

@media screen and (max-width: 699px) {
  [data-section-id="5f310b9e0c19916a428a5342"] .gallery-fullscreen-slideshow {
    height: 45vh !important;
  }

  [data-section-id="5f310b9e0c19916a428a5342"] .gallery-fullscreen-slideshow-item {
    height: 45vh !important;
  }
}

@media screen and (min-width: 700px) and (max-width: 999px) {
  [data-section-id="5f310b9e0c19916a428a5342"] .gallery-fullscreen-slideshow {
    height: 55vh !important;
  }

  [data-section-id="5f310b9e0c19916a428a5342"] .gallery-fullscreen-slideshow-item {
    height: 55vh !important;
  }
}

Hi @rwp could you take a look at this page please. I can not find a code anywhere to fit the gallery to size on mobile

On 9/18/2020 at 12:44 AM, ShortAngryViking said:

Hi @rwp could you take a look at this page please. I can not find a code anywhere to fit the gallery to size on mobile

https://ray-cone-ap64.squarespace.com/gallery

 

passcode: 12345

 

Add to Page Settings . Advanced > Header

<style>
@media screen and (max-width:767px) {
.gallery-fullscreen-slideshow {
    height: 40vh !important;
}
}
</style>

Thank You @tuanphan

@tuanphan

Any suggestions for my website https://www.homestead-village.com/

I am trying to get the main slideshow gallery on the homepage to not get cropped on mobile! I tried the code above with luck. Any suggestions? 

Thanks! 

Sam

15 hours ago, Shume27 said:

@tuanphan

Any suggestions for my website https://www.homestead-village.com/

I am trying to get the main slideshow gallery on the homepage to not get cropped on mobile! I tried the code above with luck. Any suggestions? 

 

Thanks! 

Sam

Hi. Can you disable autoplay? We can check easier

@tuanphan I have turned off autoplay on slideshow!

On 12/9/2020 at 10:27 PM, Shume27 said:

@tuanphan I have turned off autoplay on slideshow!

Hi. It looks like good here. Did you solve this?

Yes- I solved a solution- it's not full bleed but it works just fine.  @tuanphan