Need footer to follow browser's bottom

Hi there,

I’m new to blocs and my issues is that if there’s a small amount of content on a given page it leaves a blank space between the footer and the bottom of the browser window.

I’ve tried code for a ‘sticker footer’ which locks the footer to the browser’s bottom but when you squeeze the browser window upwards the footer over-rides the page content, I would like the top of the footer to stop a the bottom of the last bloc.

Any solutions out there? thanks.

Make sure the footer is in the bottom global area. Also make sure there is no bloc below your footer, also it could be the bloc padding that is causing the problem.

Casey

Thanks Casey but that was the first thing I checked and I’ve just tried out different padding sizes but my problem persists. I can’t help but think there must be an obvious solution to this, any other ideas?

Kevin

I was going to say to just add a bloc under, but of course that adds to all the pages then.

@Aux1 if was men i would just add anything like a banner or a testimonial or client list or something to pad that page out so no dead space under the footer - good luck!

I picked up a good solution in an old post from Norm…

Select the Bloc in the dynamic area and set its padding to fill screen it will force the site to take up the entire screen cause if foot to be fixed to bottom of browser.

Issue Solved!

But won’t that give a huge section under every page footer? or will it work responsive and fill when needed?

My my theory was just to add a bloc under the footer and set it to XXL padding. - but having that on every page looks a bit off putting.

Unless you just ignore the global footer if you have a few pages and make the footer within the content area of each page and have a bespoke one for the page you need it - and keep away from Global content?

If not many pages, ignore the global and just add a bloc on the bottom on the one you need to fill and duplicate the main section on the pages you want without the fill…

** Not sure if this is what you was after !!? maybe not !!! if not - then just pad the smaller content area to fill?

No, it works responsive and fills when needed. I don’t want my footer scaling out of proportion with the rest of the page. Norm’s solution is both simple and effective.

Kevin

1 Like

But the solution does not work for me; my middle bloc, with full screen, becomes huge when i only want a little padding at top and bottom of the bloc. Yes, the footer stays at the bottom and there’s no space below anymore, but the middle bloc looks ridiculous. Is there a solution to this yet? It seems like it should be easy.

Flexy Foot will solve your problem. Make sure you donate generously to the developer @PeteSharp for his hard work!
https://blocs.store/product/flexy-foot/

1 Like

Thanks. I think I installed it, but i don’t see it in my brics library as an option…? How do you use it exactly?

What about watching the video?
https://blocsbuilder.com/flexy-foot/

Actually i figured it out and it works great. My NEW Problem is this: I have a super simple “success” page but no matter what i do, there is a chunk of white space under the center bloc. The footer stays put with flexy footer, no problem. But I cannot get that white space to go away under the middle bloc. (There is only header/middle/footer. For example, as a test I put the flexy footer in each bloc (header, middle and footer). When i did that, it worked as it’s supposed to, but i had a chunk of white space ABOVE my header instead of under the middle bloc! I think it has something to do with vertical height default set at 100, but i can’t figure out how to fix it. :frowning: Anyone? I feel dumb bc this seems simple, but I’ve never encountered this problem before.

Did you set a background color?

I have tried that, but then the space is still there, just that teal color. And I can’t really do that because other pages can’t have that background color they need to be white…

So the teal BG colour is supposed to run down to the footer??

Just apply a background colour on that page only.

Yes but there is that extra space from the illustration to the footer… the margin should be equal to what’s at the top but it puts extra space… and i did end up putting the teal as the background color and changed the bloc colors on the first page all to white (so they wouldn’t appear teal.) Still I have the space below the image. (see attached).

Oh you want to vertically centre the Graphic?