How to Make Bootstrap 5 Footer Fixed at the Bottom

1 year ago admin Bootstrap

In today's lesson, we will see how to make Bootstrap 5 footer fixed at the bottom of the page, sometimes when you are working on a project with Bootstrap 5 you notice that the footer is not at the bottom if the body height is less than the viewport height.

Fix the footer at the bottom

So to achieve that we add the class 'fixed-bottom' to the footer.

show or hide the code

                                                    
                                                                                                                <footer className="fixed-bottom">
    <nav className="navbar navbar-expand-lg navbar-light bg-light">
          <div className="container-fluid">
               <ul className="navbar-nav mx-auto mb-2 mb-lg-0">
                   <li className="nav-item">
                       <a className="nav-link active" aria-current="page" href="#">
                          <i className="bi bi-c-circle"></i> DCoding 2023.
                       </a>
                   </li>
               </ul>
          </div>
     </nav>
</footer>

Related Tuorials

How to Use Bootstrap Tags input

In this lesson, we will see how to use Bootstrap tags input, as we know bootstrap 5 does not provide...

How to Create Three Dots Dropdown Menu in Bootstrap 5

In today's lesson, we will see how to create a three dots dropdown menu in Bootstrap 5, as we know b...