Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Which browser & browser version is the problem occurring in?
Hi
Chrome 23.0.1271.95 m and IE9
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Sorry, I can’t replicate the issue in neither browser.
strange, are you on a laptop screen?
It only happens on pages where the content doesnt fill the whole page
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Yes, if I zoom out, your footer does not stay at the bottom. Are you trying to achieve a footer that sticks to the bottom of the window? If so, consider this tutorial http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page
Hi,
Sadly that didnt work – or i dont understand how i can apply that code to my blog
any more thoughts?
Thanks
The issue is with your CSS (line 265)
.FooterBG {
width: 100%;
float: left;
background: none repeat scroll 0% 0% rgb(0, 0, 102);
padding: 25px 0px;
position: absolute;
bottom: 0; // this will fix the bar to the bottom of the page
}
Hi,
Thanks for your help but the footer is now in the middle of the page when i scroll down
it should be underneath all of the content
Thanks
Absolute positioning is the problem. It puts the footer at the bottom of the window — NO MATTER where that is on the page.
ok, thanks
is there another way to position the footer instead of using position: absolute;?
Thanks
Yes, try changing the above to:
.FooterBG {
width: 100%;
float: left;
background: none repeat scroll 0% 0% rgb(0, 0, 102);
padding: 25px 0px;
margin-top: 20px;
}
Adjust the margin so it’s below the other elements.
Thanks, its positioned at the bottom of my site now but there is still a white gap below the footer.
FIXED!
I added margin-bottom: -20px to your code and its sorted now
Thanks for all of your help
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Ninja, what happens when someone visits the website on a larger (taller) screen?
ah…..exactly the same thing
damn.
Any thoughts Andrew?
