Faire en sorte que la div reste toujours en bas du contenu de la page, même s'il y a des barres de défilement.

Question

CSS Push Div to bottom of page

Regardez ce lien, je veux le contraire : Lorsque le contenu déborde sur les barres de défilement, je veux que mon pied de page soit toujours à l'emplacement de la complet en bas de la page, comme Stack Overflow.

J'ai un div avec id="footer" et ce CSS :

#footer {
    position: absolute;
    bottom: 30px;
    width: 100%;
}

Mais tout ce qu'il fait, c'est aller au bas de la fenêtre, et y rester même si vous faites défiler la page vers le bas, de sorte qu'il n'est plus en bas.

Image :

Désolé si ce n'est pas clair, je ne veux pas qu'il soit fixé, mais seulement qu'il soit en bas de tout le contenu.

Answer 1

Si vous avez un pied de page de hauteur fixe (par exemple 712px), vous pouvez le faire avec des js comme ceci :

var bgTop = 0;
window.addEventListener("resize",theResize);
function theResize(){
    bgTop = winHeight - 712;
    document.getElementById("bg").style.marginTop = bgTop+"px";
}

Answer 2

utiliser une classe bootstrap à fond fixe

<div id="footer" class="fixed-bottom w-100">