Fixate Footer Position Or Delete Space Underneath
Michael Nolden
Hi Guys its me again,
because of your great and fast help, I'd like to ask something new which would take me hours of searching deep in the template and I would probably destroy mechanics.
On some pages of my site the Footer is not the last position so that there is a white space underneath it. This happens just on 2k or 4k resolution-screens. How can I fixate the footer as last position? It shall always be the deepest part of the homepage?
See screen: https://ibb.co/ZYKNYwG
URL Example: https://www.sg-rheinbach.de/service/kontakt
Pavel
Accepted AnswerHi Ofi. The footer is not nailed to the bottom. Do not you know this? Publish an empty page to see it.
Hi Michael. This code will solve the problem. Place it in custom.css file
html, body, .body-wrapper {
height: 100%;
}
.body-innerwrapper {
min-height: 100%;
display: flex;
flex-direction: column;
}
#sp-footer {
margin-top: auto;
}
Michael Nolden
Accepted AnswerWhat do you mean with "this portion"? I guess there is text missing?
Anne
Accepted AnswerHello Michael Nolden,
Thanks for contacting with us. I didn't find any white space there. Please, clear the joomla and browser cache and check your site in incognito window.
-Regards
Ofi Khan
Accepted AnswerHello Michael Nolden
Sorry, I have not found the blank space issue. Could you please share more details? Which device or browser are you checking? Try different browsers and let me know where the issue happens.
Best regards
Michael Nolden
Accepted AnswerOk, I reacreated the footer position in layout but that doesnt change anything. Also the deletion of the browser cache doesnt help.
The problem exists in each browser like MS edge, Chrome or Firefox.
I think its more over a problem of resolution. I have 3 screens and one has just a HD-resolution like 1920x1080. On this screen the footer is always at the bottom of the page. But if I switch the browser window to the other screens (3840x1600 and 2560x1440) then there is a blank white space underneath the footer. It is just happening on pages, where the content is realy small like on contact
Here is another screenshot in which you can see my both displays (top HD and down is the 2k resolution screen): https://ibb.co/4Z2rCBv
Ofi Khan
Accepted AnswerI am not sure that it is a real world problem Could you please give me a device example that has this issue? You are checking from browser inspection.