How can I force the footer to bottom on short pages? I tried many CSS solutions, but none of them worked.
Hi,
If you could provide an example of such a page, I will try to give you a solution, if possible.
Thanks
Hi,
The website is under construction and I can’t provide a link, but you can easily reproduce such a page by applying ‘display: none’ to several elements of any of the entries of your default theme, until the page is short enough, so that the footer doesn’t reach the bottom of the browser anymore.
Then a white space shows up below the footer, just because there is not enough content to ‘push it down’.
I need the height of the page to be always 100% the height of the browser.
This did not work:
html {
height: 100%;
}
body {
min-height: 100%;
}
Thanks in advance!
Hi,
There could be a code you can try, but it may require modifications. If you also use a sub-footer it may not work properly in some cases
– https://www.screencast.com/t/NAWUes61Vt
– https://www.screencast.com/t/pAtmUuFgZPR4
.td-sub-footer-container,
.td-footer-wrapper {
position:fixed;
bottom:0;
left:0;
right:0;
}
Thanks
It is a good way, but when I save it, it is loading always. How to solve it?
Hi,
Once entered the code will apply always. That solution may not work properly for all pages in all situations. It could work if you were to use it more specifically, by including the page ID in the code so it applies only for specific pages
.page-id-XXX .td-sub-footer-container,
.td-footer-wrapper {
position:fixed;
bottom:0;
left:0;
right:0;
}
The page ID can be seen here for example – https://www.screencast.com/t/UI5GJM0s
Or with the browser inspector – https://www.screencast.com/t/v3NcIldEC
