Evitar que menu bootstrap se monte.

[diegodelpiero]

Buen dia, estoy elaborando un menu en bootstrap pero que va en la parte inferior de mi pagina, la cuestión es que cuando reduzco el tamaño de la ventana este menú se monta sobre el footer,

esto es lo que pasa:

https://i.ibb.co/pQkJSYD/nav.png

este es mi codigo:

Código HTML:

<nav class="navbar navbar-expand-lg navbar-light bg-light">
     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
    <div class="navbar-nav">
    <li><button class="fill" onclick="window.location.href='solicitud.php'">Nueva solicitud</button></li>
         <li><button class="fill" onclick="window.location.href='pendientesusuario.php'">Pendientes</button></li>
         <li><button class="fill" onclick="window.location.href='asignadousuario.php'">Asignados</button></li>
         <li><button class="fill" onclick="window.location.href='resueltolistausuario.php'">Resueltos</button></li>
    </div>
  </div>
</nav>
 
 
<?php include ("template/pie.php"); ?>
 

y esto es lo que tiene el archivo pie.php

Código PHP:

<footer class="bg-light text-center text-lg-start">
  <!-- Copyright -->
  <div class="text-center p-3" style="background-color: rgba(0, 0, 0, 0.2);">
    © 2022
    <a class="text-dark">Chamorro Portilla SAS - Sistemas</a>
  </div>
  <!-- Copyright -->
</footer>