Bonjour, Bonsoir

J'ai un petit soucis avec mon footer par exemple quand il y as trop d'élément dans la page, mon footer ne descend pas et reste fixe et les élément passe à travers.

Comme ceci :

http://prntscr.com/d60gfq

Voici le css de mon footer :


/** FONT **/
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700');
/** FONT **/

body{
    font-family: "Roboto Condensed", sans-serif;
}

footer{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 40px;
    background-color: #424242;
}

footer p{
    margin-top: 12px;
    text-align: center;
    text-transform: uppercase;
    color: white;
    font-weight: bold;
}

Merci d'avance
Bonne journée/soirée.
Cordialement, Siak

3 réponses


Bonsoir,

Pourrait-on voir ton HTML ? Peux-tu mettre ton code sur un codepen ? Merci :)

salut,

Dans un footer logiquement c'est le dernière element de ta page donc tu n'as pas besoin de le demander de ce mettre en bas de page car les élément se positionne en dessous des autres selon comment tu les positionnes dans ta structure html donc logiquement si tu enlève ce bout de code ça devras fonctionner :

position: absolute;
bottom: 0;
left: 0;
right: 0;

et si ça ne fonctionne pas remplace : absolute par relative
Cordialement,

Bonjour,

Aujourd'hui tu peux aussi utiliser les flexbox pour fixer un élément en bas, la solution du bottom:0 fonctionne mais choisir flexbox te permet d'utiliser une méthode un peu plus actuel.