Discussion :

[OZ1977]

Bonjour,

je développe actuellement un projet Django et je souhaite mettre en place un footer collé en bas de page (sticky footer).

en cherhcant sur les forum, j'ai trouvé une solution qui 'fait le job' (càd coller le footer en bas de page) mais qui a un comportement gênant à savoir qu'en fonction de la taille de l'écran il masque certains boutons (par exemple les bouton de pagination d'un dataTable)

c'est également gênant pour mes tests fonctionnel (sélénium) car certains tests échouent pcq les butons sont masqué par le footer (cf image dans l'encadré rouge)

y-a-t-il un pied de page bootstrap ou un moyen de pallier ce problème ?



style.css

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
 
/* Sticky footer styles
-------------------------------------------------- */
 
.asteriskField{
  display: none;
}
form .alert ul li{
  list-style: none;
}
form .alert ul {
  margin:0;
  padding: 0;
}
body > div > div.col-6 > div > div > h2 {
  font-size: 20px;
}
.footer {
  position: fixed;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  line-height: 60px; /* Vertically center the text there */
  background-color: #f5f5f5;
  /*background-color: red;*/
 
}

[Invité]

Bonjour,

1- Ajoute un media query pour n'appliquer le sticky footer qu'à partir d'une certaine largeur.

2- OU un margin-bottom à la page, de la hauteur du footer.