Forum : Comment garder le footer en bas de la page web

Bonjour,
Je suis en train de developper en PHP POO

Dans un fichier défault.php j'ai un le header et footer.
et entre le des deux il y aura le contenu qui va être chargé dynamiquement.

Sauf que voilà certaine page très remplis et d'autre page son casiment vide.

Alors je voudrais savoir

Comment je fais pour avoir toujours le footer en bas de page dans tous les cas.

sachant que j'ai le même footer pour toutes les pages.

En réféchissant et en charchant sur le net j'ai trouvé ce ci :

footer {
  position: absolute;
  bottom: 0;

Cette solution fonctionne très bien quand j'ai une page qui atrès peu de contenu html

Mais quand j'ai une page très remplis en contenu html, j'ai le footer qui se place en plein milieu de ma page web juste en bas de mon écran d'ordinateur et non pas en bas de la page web.

Comment puis-je faire garder le footer toujours en bas de la page web ?

Devdeb22

Auteur

Réponse acceptée

Solution trouvé :

html {
  position: relative;
  min-height: 100%;
}
body {
  /*Margin bottom by footer height*/
  margin-bottom: 60px;
}

footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /*Set the fixed height of the footer here*/
  height: 0px;
}

ça peut toujours servir !

Balsakup

Salut,

Il suffit d'utiliser les flexbox en mode colonne

quenti77

Voilà un exemple sur jsfiddle (mais ne prends pas en compte le js qui ne sert qu'a te montrer le sans et avec gros contenu) :
https://jsfiddle.net/2kb5fhzd/3/

GrCOTE7

@quenti77, @debdev22

Basé sur l'exmple de Quenti, ne serait-ce pas cela souhaité, Debdev22 ?

https://jsfiddle.net/grcote7/ys971xdh/

Balsakup

@Aadminli

Relis bien ;)

Mais quand j'ai une page très remplis en contenu html, j'ai le footer qui se place en plein milieu de ma page web juste en bas de mon écran d'ordinateur et non pas en bas de la page web

Comment garder le footer en bas de la page web

5 réponses