bootstrap footer at bottom code example

Example 1: bootstrap footer bottom of page

<!--Use the navbar component and add .navbar-fixed-bottom class:-->

<!--Bootstrap 3.x-->
<div class="navbar navbar-fixed-bottom"></div>

<!--Bootstrap 4.x-->
<div class="navbar fixed-bottom"></div>

<!--Don't forget to add body { padding-bottom: 70px; } or otherwise the page content may be covered.-->

Example 2: sticky footer bootstrap 3

<style>
.footer {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   background-color: red;
   color: white;
   text-align: center;
}
</style>

Example 3: sticky footer not working bootstrap

/* 2020 - bootstrap 4.5+ 
Note: - The flex-fill utility was included in Bootstrap 4.1 at later release. 
So after that release the extra CSS for flex-fill won't be needed. 
Additionally min-vh-100 is included in newer Bootstrap 4 releases */
<div class="d-flex flex-column min-vh-100">
    <nav>
    </nav>
    <main class="flex-fill">
    </main>
    <footer>
    </footer>
</div>

Example 4: how to make footer static bootsrap

<div class="sticky-top">...</div>