Jump to content

Index Gallery Fill Screen On Mobile

Recommended Posts

Site URL: https://www.thebigromance.ie/select

Hey all,
Having some trouble on site if anyone can offer a suggestion. It's working fine on desktop, but on mobile in stacked view i'd like both images to fill the screen rather than have to scroll to see both. 

You can view it here: 
https://www.thebigromance.ie/select

Code i've used to fill screen on Desktop so far is: 

.Index-gallery-item {
height: 100vh !important;}

.homepage article.Index-gallery-item 
{height: 100vh !important;}

Any help would be great, can't quite figure it out. 

Thanks! 

 



 

Link to comment
  • Replies 6
  • Views 417
  • Created
  • Last Reply

Oh Hey Tuan, 
Hope you're well. 
Sure. You can see it at : https://www.thebigromance.ie/select

I have it working a bit better now, but on mobile you still have to scroll up and down a bit.
I have '44vh' as the height but if there was a way of getting it to fit automatically that would be better. 

The code i'm using at the moment is: 

// * * * SELECT PAGE * * * //

.Index-gallery-item
{height: 100vh !important;}

@media screen and (max-width:800px) {
  .Index-gallery-item
  {height: 44vh !important;}}

/* SIZE: hide footer */
.Footer-inner 
{display: none !important;}

(There is other code relating to font sizes & overlays but I removed as that doesn't really relate)


Thanks!

 




 

Link to comment
  • 2 weeks later...

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.