Shopify themes, liquid, logos, and UX
I'm trying to position my footer as described in the article below:
https://www.freecodecamp.org/news/how-to-keep-your-footer-where-it-belongs-59c6aa05c59c/
Essentially I want the footer to always be at the bottom of the content, unless the content doesn't go the bottom of the page. In that case the footer goes to the bottom of the page, leaving blank space between it and the content.
The trouble is almost every single solution I can find requires the footer to be a specified height. The few that claim will work for dynamic heights don't work., just not sure if that's due to Shopify or myself.
I've set the footer's style to position:absolute, bottom:0 and left:0. This ensures its always on the bottom of the page/content.
Problem is If the footer is against the bottom of the content, the footer overlaps it.
Usually the solution is to set a padding-bottom to the main content thats equal to the height of the footer.
My footer's height isn't set, so I try to make a query and set the padding with javascript but any of the methods I've tried always return 0.
offsetHeight, clientHeight, getBoundingClientRect
So I either need a method of getting the height of an element, or an entirely new method of positioning the footer.
Any and all help would be appreciated.
Hii, @jrlans
Kindly share your store URL so,
I can solve it perfectly.
Thank You.
Hey @Zworthkey,
I sent you a message with the URL yesterday. Let me know what you think.
Bump. Any suggestions would be greatly appreciated.
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024