Jump to content

How to make a background image fill any browser height? 7.1

Recommended Posts


So the home page of my site should ideally be static with no scrolling. The first issue I run into, is that when previewing my page, the background image has a white bar (negative space) at the bottom due to the content not going down the page far enough.

To fix this, I add a spacer at the bottom and extend so that the preview doesn't have any bar or scrolling.

However, this is only true for the browser size of my preview, for example, when I fullscreen my browser, the negative space is back because the page is larger and the content once again doesn't go down the page far enough.

Adding a longer spacer to cover all grounds is not ideal as I would not like the page to scroll, however, adding code to remove scrolling will also remove the scroll on mobile, where the page won't show everything.

The site isn't published so I'm unfortunately not able to provide a visual example.

Is there any way to make the page automatically fill to the broswer size? Or alternatively, is there an easier fix for my issue?

Link to comment
  • Replies 1
  • Views 478
  • Created
  • Last Reply


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.