There's a random white space under my "how it works" page

for some reason I’m seeing a large white space under my footer for the “how it works” page of my site. I’ve checked the margins and for any extra divs. Can’t find anything.

https://preview.webflow.com/preview/beepyo-app?preview=be7abbb449a477219b83160e9f837728

Is it possible you’re seeing the bottom of the page body and the footer doesn’t go down far enough to cover it? Like this:

my page body is set to auto, so i would assume that it would automatically fit into the height of all the divs within it.

The page body being set to auto doesn’t affect the vertical height of anything inside the body. Fortunately, there’s a simple solution for what you’re looking to achieve! :slight_smile: Check out the Sticky Footer tutorial here:

Gotcha, thanks! Gonna give it a try!

1 Like

@McGuire I’ve tried using the flexbox on that page to fill the empty space in the sections, but I’m still seeing the white space underneath the footer. Any ideas?

https://preview.webflow.com/preview/beepyo-app?preview=be7abbb449a477219b83160e9f837728

Hi @Bryan_Trang, try removing the style overides that are set on the class assigned to the bg video. Those are causing the whitespace. I would use the default bg video setting except for maybe 100% width and height.

I hope this helps !

1 Like

Thanks fixed the issue! Do you know why that’s causing the space?

Hi, @Bryan_Trang, the main reason was that the background video normally has overflow hidden, and in the overrides that was set to overflow visible. The background video dimension, was larger than the element containing the video, so the non-visible “dimension of the video” takes up space on the page.

Glad to hear it is worked out :slight_smile:

Ahh makes sense. Thank you for helping!!

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.