Topic: Footer does not stick to the bottom page
In case of small content in main layout footer goes up when it should be located in the bottom page
http://figaro.com.pl/adam/mdb/admin_footer.png
![http://figaro.com.pl/adam/mdb/admin_footer.png](http://figaro.com.pl/adam/mdb/admin_footer.png\""){kind=link}
Here you can find a working example and explanation
https://mdbootstrap.com/docs/standard/navigation/footer/#section-fixed-footer
import React from "react"; import { MDBFooter } from "mdb-react-ui-kit";
export default function Footer() { return ( © {new Date().getFullYear()} Copyright: Minderacodeacademy ); } this code is not sticking on the bottom of the page
Adam Adamczyk free commented 6 years ago
Thanks. Apparently it starts to work fine with "fixed-bottom" class.AP foto free commented 5 years ago
Your solution link works perfect! Thank you.
Your code has errors
<footerclass="page-footer center-on-small-only pt-0 mt-5 fixed bottom">
There has to be a space before the word "class" in general and a hyphen "-" between fixed and bottom.
so <footer class="fixed-bottom..... (in any order you want them in)
See below
<!–- Footer -–>
<footer class="page-footer center-on-small-only pt-0 mt-5 fixed-bottom">
<!--Copyright-->
<div class="footer-copyright">
<div class="container-fluid">
© 2017 Copyright: <a href="https://www.MDBootstrap.com"> MDBootstrap.com </a>
</div>
</div>
<!--/.Copyright-->
</footer>
<!–- /.Footer -–>
Adam Adamczyk free commented 6 years ago
It was mistake in my copy and paste. In fact in my sources files this section is the same as you wrote.Marina Pinto free commented 6 years ago
I though it strange as it happened to all classes :) Is it working now? - with the "fixed-bottom" (as opposed to having the space)Adam Adamczyk free commented 6 years ago
No problem still persists.AP foto free commented 5 years ago
If you have a dynamic page when it has enough content the fixed-bottom doesn't work. The footer stay there on top of the content. Bartlomiej Malanowski has the solution link.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Free
- Premium support: No
- Technology: General Bootstrap questions
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: Yes
Tech Labx free commented 6 years ago
Try adding the "fixed bottom" class to the footer and see if it works. It works for fixing social buttons to the bottom of a sidenav.Adam Adamczyk free commented 6 years ago
Nope. Same behavior. <!--Footer--> <!--Copyright--> <div> <div><!--Footer--></div> <div><footerclass="page-footer center-on-small-only pt-0 mt-5 fixed bottom"></div> <div><!--Copyright--></div> <div><divclass="footer-copyright"></div> <div><divclass="container-fluid"></div> <div>© 2017 Copyright: <a href="https://www.MDBootstrap.com"> MDBootstrap.com </a></div> <div></div></div> <div></div></div> <div><!--/.Copyright--></div> <div></footer></div> <div><!--/.Footer--></div> </div> <pre> </pre> <!--/.Copyright--> <!--/.Footer-->