No necesitas CSS adicional, con las clases de Bootstrap bastan. Como bien te indican en los comentarios, lo primero que debes hacer es darle un alto mínimo a tu `<body>`, lo consigues con `.min-vh-100`, adicional puedes hacerlo flexible y con contenido en columnas, con esto logras que el `<footer>` se pueda posicionar de arriba a abajo. <body class="d-flex flex-column min-vh-100"> Lo último que deberías hacer es añadir la clase `.mt-auto` al elemento `<footer>`, es lo mismo que decir: `margin-top: auto`. Y el resto lo realiza automático *flexbox.* <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-html --> <head> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"> </head> <body class="d-flex flex-column min-vh-100"> <h1>Hola</h1> <footer class="mt-auto footer bg-dark"> <div class="copyright text-center text-light my-auto"> <span>Proyecto - Gestion Clinica dental</span> </div> </footer> </body> <!-- end snippet -->