Jump to content

White space at bottom of resized page

Recommended Posts

Hi,

I have a front page that has a white space showing between the bottom of the main section and the footer, The pages are all set to be the off white so it stick out a bit and only happens on the front page. I have tried to find out where to change that in the colour editor but nothing seems to impact on it and I wondered if anyone had a solution or a fix maybe?
New to all this so... 

Massive thanks in advance for any help, have attached a few screen grabs that may help explain and also show how that front page is set up etc. 

Thank you!

Tim 

Screenshot 2024-07-06 at 16.15.26.png

Screenshot 2024-07-06 at 16.15.58.png

Screenshot 2024-07-06 at 16.16.07.png

Screenshot 2024-07-06 at 16.16.30.png

Link to comment
  • Replies 3
  • Views 157
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

Posted (edited)
11 hours ago, AmbientLife said:

Hi, yes sorry I thought I had included it, 
https://www.ambientlife.co.uk

 

It looks like it's only happening when the screen size surpasses size of that section, and since you're not using your default site theme for that section the white gap appears. 

Two options:

1. Change the default site theme background to match that light grey color. Usually the default color theme is Lightest 1, you can confirm that by adding a blank section to a webpage and seeing which theme is being used. 

2. If you don't want to mess with your colors you can add some css to make this section "auto fit" the screen, no matter what size screen you're on.  Website Tools  → Custom CSS 

//homepage banner full screen//

@media (min-width: 720px) {
section[data-section-id="6642282f68e9d772ca52d822"] {
  height: 100vh !important;
}
}

 

Edited by HerMessyBun
Updated to not affect mobile view
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...

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.