Comment obtenir un alignement réactif du pied de page dans Twitter Bootstrap ?

Alignement réactif du pied de page avec Twitter Bootstrap

Dans cet article, nous explorons un problème rencontré par les utilisateurs qui tentent d'aligner leurs pieds de page au bas de la page en utilisant des techniques CSS dans le contexte de Twitter Bootstrap, un framework réactif populaire.

Le problème se pose car Twitter Bootstrap utilise un framework réactif conception, ce qui rend difficile l'obtention de l'alignement de pied de page souhaité à l'aide des méthodes CSS conventionnelles. Pour résoudre ce problème, examinons les solutions potentielles :

Bootstrap 2.2.1 et versions ultérieures

Avec Bootstrap 2.2.1 ou version ultérieure, cette fonctionnalité est désormais prise en charge de manière native.

Bootstrap 3.x

Dans Bootstrap 3.x, utilisez le composant navbar avec la classe .navbar-fixed-bottom :

<div class="navbar navbar-fixed-bottom"></div>

Bootstrap 4.x

Pour Bootstrap 4.x, utilisez le code suivant :

<div class="navbar fixed-bottom"></div>

Supplémentaire Remarque

N'oubliez pas d'ajouter également le CSS suivant pour éviter que le contenu de la page ne soit couvert :

body { padding-bottom: 70px; }

Pour une documentation plus détaillée, reportez-vous au site officiel de Bootstrap : http:/ /getbootstrap.com/components/#navbar-fixed-bottom

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!