Comment conserver un pied de page en bas de page même lors du défilement ?

Positionner la division en bas du contenu avec des barres de défilement débordées

Lorsque le contenu de la page s'étend au-delà de la fenêtre d'affichage, les développeurs sont souvent confrontés au problème des pieds de page apparaissant au-dessus du limite inférieure de la page. Pour résoudre ce problème, considérez l'implémentation décrite dans l'image fournie.

L'extrait CSS initialement utilisé, comportant position : absolue et bas : 30 px, positionne le div en bas de la fenêtre. Cependant, lors du défilement, le div reste stationnaire, se détachant de la limite inférieure du contenu.

Solution

L'approche optimale pour ancrer le div de manière persistante au bas du contenu nécessite l'emploi d'un positionnement fixe. Voici le CSS révisé :

#footer {
    position: fixed;
    bottom: 0;
    width: 100%;
}

Cette modification permet d'obtenir l'effet souhaité. Le div reste fixe au bas de tout le contenu, quel que soit le défilement. Le violon fourni démontre ce comportement : http://jsfiddle.net/uw8f9/.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!