Thanks for this, however I think I may have mislead you. The issue I have isn’t that I want the footer to appear at all times with the upper page scrolling, it is just that I want to ensure the footer stays at the bottom of the page as a footer. So when the visitor scrolls to the bottom of the page the footer appears and doesn’t float up the page if they zoom out or on a larger resolution.
Cause of header jumping :
We have found you were trying to make header sticky, on body scroll you have a class named “sticky-header” adding to body tag, just set padding to 0 in this class, and issue will be fixed for header jumping
I am not sure if you were trying to achieve a fixed header, because we don’t see that is happening. if you need any help in achieving fixed header please let us know.
https://www.ldf.co.uk/flipside-business-finance-thanks, the issue for footer jumping is due to lack of content on page,
you have added min-height, which will not be compatiable with all resolutions, as on larger devices you will notice gap with footer.
Best solution : as this footer is global.
you need to add class at template level, adding a unique class say ‘mincontent’, to page head.
using this class you can modify footer position
add this style to your page with min content.
Thanks for the demo. I have tried adding the css, but am struggling to apply it to the global template. Also when I look at your demo is the white section supposed to be the footer as on my screen it is up near the top of the page?
Hello Cush,
Can you please help me with a reference link , where you have seen floating footer used, will help you to implement same on this one too.
Thanks