Archived topic
Global Footer And White Space
11 replies · Started by Jose on April 8, 2021
Hello! I have a few inquiries, but I'll open a separate support topic for each one, so they'll be focused just on one thing.
I built a footer using GenerateBlocks by following this video: https://www.youtube.com/watch?v=ZLmSiXcwuA4. The footer turned out great, but I thought it wasn't going to leave white space in both the left side and right side of it, but cover up all of the footer area as in the video. I've attached a screenshot of the issue in the private option below.
How can I have the footer cover up that white space completely as in the video? Thanks!
Hi Jose,
Check the container witch holds the footer content, is it set to Full width both the outside container and the inside container?
Let me know :)
Yes, they both are set to full width. I've attached a screenshot of it in the private info field for you to double-check it :)
Can you link us to the page in question so we can inspect it?
Yes, I've linked to the page in question in the private info field :)
Sorry I made a mistake, the inner container should be set to contained width.
What's the hook you are using for the block element? Is it site_footer?
If so go to Customizing > Layout > Footer, set Footer Width to full.
Let me know :)
Yes, for the block element I used generate_footer. After setting footer width to full in Customizer it worked perfectly. Thank you!
Nice :)
You are welcome!
Hello again,
I've built this same footer on another staging site I have created and encountered a little bit of an issue on this one. There is a bit of white space again but not on the sides but exactly below the footer this time. How can I have the footer cover up that white space completely again? Here is a screenshot illustrating what I mean: https://screencast-o-matic.com/i/crfQiUVnbCE.
I've also shared a link to the site in the private info field below so you can take a closer look.
Hi there,
Your block containing "© 2021 REDACTED" is causing this issue.
The 30px margin-top you've placed on the container is causing the white space you're seeing below the footer.
Adding this CSS should be a quick fix for this:
.site-footer {
overflow: hidden;
}Great, the issue is gone! Thank you! On a side note, would you mind kindly deleting my brand name REDACTED from your response, as this accidentally discloses my site? I apologize haha. Thanks again!
Hi there,
i removed the brand name from Elvins and your reply :)
