Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Need to force gallery slideshow to fit on smaller mobile screens


1WorldPrint

Question

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.

IMG_9502.PNG

f7400ed8-1887-47e2-be1a-4a09f07b68b6.jpg

Link to post
  • Answers 9
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

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

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

Posted Images

9 answers to this question

Recommended Posts

  • 0
@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;
  }
}

 

Link to post
  • 0
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>

 

Link to post
  • 0
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

Link to post
  • 0
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?

image.thumb.png.34d7f35edefa7286660d0ad6d40a5d7f.png

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...