Jump to content

Portfolio Page - White block appearing

Recommended Posts

Site URL: https://fifty-fifth.com/ned-champain/japan-ready

Hey there!

URL in question: https://fifty-fifth.com/ned-champain/japan-ready

I'm having an issue with my portfolio pages. I have made the background of these specific pages black as well as the footer of the page - however, when viewing the site on mobile device or when decreasing the width of my browser window there is a large white block that separates the portfolio navigation and the footer. Is there anyway to fill this white block with black? I have tried to move things around and apply spacers but it ruined the design so I'm turning to CSS. It seems like a Squarespace error! 

Even when I remove all custom code from the entire site there is the same issue.




Link to comment
  • Replies 2
  • Views 1k
  • Created
  • Last Reply

Hi @Ned

The white is the "gap" between the page content and the footer. It's appearing on this page because, when the image shrinks for mobile, the page content isn't long enough to fill the page, at least not on a larger iPhone. You probably wouldn't notice this on a smaller phone or with a white background 🙂.

A simple workaround is to use some CSS to add some bottom padding to the item-pagination--prev-next on this page on mobile devices. This will fill the gap with the black background of the pagination. For example, something like:

@media screen and (max-width: 767px) {
  #item-5e9337f284e1fa3b45a9195a .item-pagination--prev-next {
    padding-bottom: 134px;

Let me know how you get on.


About me: I've been a SQSP User for 18 yrs. I was invited to join the Circle when it launched in 2016. I have been a Circle Leader since 2017. I don't work for Squarespace. I value honesty, transparency, diversity and good design ♥.
Work: I founded and run SF.DIGITAL, building Squarespace Extensions to supercharge your commerce website. 
Content: Views and opinions are my own. Links in my posts may refer to SF.DIGITAL products or may be affiliate links.
Forum advice is free. You can thank me by clicking one of the feedback emojis below. Coffee is optional.

Link to comment


This worked a like a charm for mobile - thanks so much!

Do you think there is anyway to add some kind of flexbox style padding where it automatically fills the rest of the page down to the top of the fixed footer depending on the width of the desktop window? Just so that if anyone changes the size of their desktop window it won't appear there as well. Or am I pushing my luck? 



Link to comment


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.