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

Removing blank space on mobile version of site


Recommended Posts

On 6/3/2022 at 10:55 PM, gwynethm said:

Happy Friday!

My CEO brought this request to me this morning. I need to remove the excessive white space from the mobile version of our website (desktop version is fine), and I'm not sure how to find the correct id for the  section in question. - I'm assuming that is the difference with all the answers that have been given before this request. - It happens on every page, so I'm guessing it's something to do with the header? I'm including a screenshot and the URL below. If you could please help, I would be so thankful!

Thanks in advance!

https://www.mainstreetruralhealth.com/

image.thumb.jpeg.848ca4b27cd0a09c4bac6bb8ffba1cdf.jpeg

Add to Design > Custom CSS

@media screen and (max-width:767px) {
[data-section-id="60c0f388a0d13b2463e73581"] {
    padding-top: 0px !important;
    min-height: unset !important;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 1 month later...

Hello friends!

New to Squarespace, so forgive my ignorance, but I'm am losing my mind over extra space below my home page gallery (see pic.) At first, the gallery was perfect on desktop but getting cutoff on mobile, so I added the code below. This fixed the issue, but then created the extra white space below the gallery. I've combed through the forums looking for a solution, but none of them seem to work. Any advice is appreciated. Thank you!

 

www.jamesjansenphotography.com

Password: TempLogin2022

 

<style>
  @media screen and (max-width:767px) {
    .gallery-fullscreen-slideshow[data-width="full-bleed"] {
    	height: 35vh !important;
    }
  }
</style>

image.png

Edited by BrianaG
Forgot website address
Link to comment
7 hours ago, BrianaG said:

Hello friends!

New to Squarespace, so forgive my ignorance, but I'm am losing my mind over extra space below my home page gallery (see pic.) At first, the gallery was perfect on desktop but getting cutoff on mobile, so I added the code below. This fixed the issue, but then created the extra white space below the gallery. I've combed through the forums looking for a solution, but none of them seem to work. Any advice is appreciated. Thank you!

 

www.jamesjansenphotography.com

Password: TempLogin2022

 

<style>
  @media screen and (max-width:767px) {
    .gallery-fullscreen-slideshow[data-width="full-bleed"] {
    	height: 35vh !important;
    }
  }
</style>

image.png

Your page content too short on mobile, is not enough to fill the height of the phone, so it will appear.

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
54 minutes ago, tuanphan said:

Your page content too short on mobile, is not enough to fill the height of the phone, so it will appear.

Oh my goodness...could it really be that simple? I feel like an idiot. 🤪

I'll add some text or something and hopefully that fixes it. 

Tuanphan - thank you for your time here. I truly appreciate your insight and expertise. 🙏

Link to comment

Create an account or sign in to comment

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

×
×
  • Create New...