Sujet Précédent Sujet Suivant

Pied de page html qui doit rester en bas

Résolu
youssef.allmlg Messages postés 48 Statut Membre -  
animostab Messages postés 3003 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour, sur mon site j'ai ce code html (modifié) : 
<div class="contenu">
du texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenudu texte et contenu
</div>
<footer>Pied de page</footer>

avec ce code css : 
.contenu {margin-bottom: 30px;}

footer {text-align: center;
height: 30px;
background-color: #f7b900;}

et je voudrais que mon pied de page se retrouve toujours en bas de la page peut importe la grandeur et sans "position:fixed".

Merci d'avance!
A voir également:

1 réponse

Réponse 1 / 1
animostab Messages postés 3003 Date d'inscription   Statut Membre Dernière intervention   738
 
Salut
Si tu veux que ton footer soit toujours collé en bas quelque soit la hauteur de page et la position du scroll je ne vois pas comment faire sans la position:fixed !
Pourquoi donc pas de position fixed ? explique ....
0
youssef.allmlg Messages postés 48 Statut Membre
 
Je ne cherche pas à ce qu'il soit toujours en bas de la fenêtre, je veux qu'il soit en bas de la page comme sur le site de comment ça marche (ce site). Je ne veux donc pas de position fixed car avec, il reste toujours en bas de la fenêtre.
0
animostab Messages postés 3003 Date d'inscription   Statut Membre Dernière intervention   738
 
Et bien ton code le place en bas de la page mais si la page est moins haute que la fenêtre ton footer ne sera pas en bas de la fenetre.
sinon il y a la propriété min-height en % que tu peux appliquer à body

exemple 
html {
  height: 100%;
}
body {
  min-height: 100%;
  margin: 0;
  padding: 0;
}
contenu {
height:auto;
min-height:80%;
}
footer {
height:20%;
}
0
youssef.allmlg Messages postés 48 Statut Membre
 
ça ne fonctionne pas car tous mes éléments qui se retrouvent dans "contenu" on des position: absolute pour les déplacer dans la page.
0
animostab Messages postés 3003 Date d'inscription   Statut Membre Dernière intervention   738
 
Normalement ca devrait fonctionner si contenu et footer sont mis en relative, après tu n'a pas parlé d'élément en absolute donc sache que pour un element, absolute fait sortir cet élément et ses enfants hors du flux et donc les tailles de ces éléments ne rentrent pas en considération pour la détermination des height de ce que est dans le flux.
0

Discussions similaires

tiret du bas
na -
Kahlan2016 -

14 réponses
Code source couleur de fond
Mehdi-Amg -
Techno01 -

9 réponses