Footer not anchored at bottom of page

I am having trouble with the footer on my site. When I have a page that doesn’t have a lot of content, there is white space below my footer. How do I get my footer to always stay at the bottom of my page. I tried sticking the footer to the bottom, but now it is always visible and over laps my content.


Here is my site Read-Only:

(how to share your site Read-Only link)

Hello @Zach_Rodriguez,

did you fixed the problem already? I look into your site and I didn’t see any white space below your footer. Maybe it was a glitch when you saw it? because the footer should not have any space at the bottom since it is a section and it is placed at the end of your site. If you still have the problem could you include a screen shot of the white space you are talking about?

It happens on the contact page. here is a screenshot.


You have to put grid 4 inside a section, not in the body. Do this, copy grid 4 (comand+c), then delete it and remove your footer symbol, add a section under section 5, inside that new section paste grid 4 (comand+v), and finally add your footer again. I hope this helps.

I put grid 4 in a section. The footer still has white space at the end. This occurs because the browser window is taller than the page. It only happens when I have a page with little content. Is there a way to keep the footer anchored at the bottom?

@Zach_Rodriguez, I figure out the problem. Your grid 4 has a margin of 100 on the top so that pushes the body between sections and makes it visible at the bottom of your footer. Get rid of both margins, top and bottom on grid 4, and on the new section where grid 4 is sitting use height of 50vh and flex layout centered vertically. that should fix your issue without changing your original layout.

This works! Thanks so much!

@Zach_Rodriguez, Im glad it worked out. By the way, good job on the Mota branding. Good luck on your website.

1 Like