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

Portfolio Page - White block appearing

Question

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.

Thanks! 

Ned

IMG_1448.PNG

Share this post


Link to post

2 answers to this question

Recommended Posts

  • 0

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.

-Paul


sf-digital-signature-logo-email145.png.46606a2288a2847f44d81b9b7b58f3a5.png
Hi, I'm Paul, founder of SF Digital, a specialist company building the features that Squarespace didn't include.
Explore our range of Squarespace Extensions, including the Wishlist, Variant Availability and Datepicker Extension
Note that links in my posts may be affiliate links. Need personal help? 
Book a Squarespace Expert.

Share this post


Link to post
  • 0

@paul2009 

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? 

Thanks

Ned

Share this post


Link to post

Create an account or sign in to comment

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


×
×
  • Create New...