Check out example codes for "how to get my footer to the bottom of the page using css". It will help you in understanding the concepts better.

Code Example 1

#page-container {
  position: relative;
  min-height: 100vh;

#content-wrap {
  padding-bottom: 2.5rem;    /* Footer height */

#footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 2.5rem;            /* Footer height */

Code Example 2

<!DOCTYPE html>
<meta name="viewport" content="width=device-width, initial-scale=1">
.footer {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   background-color: red;
   color: white;
   text-align: center;

<h2>Fixed/Sticky Footer Example</h2>
<p>The footer is placed at the bottom of the page.</p>

<div class="footer">


Learn ReactJs, React Native from