Pied de page html qui doit rester en bas

Résolu/Fermé

youssef.allmlg Messages postés 44 Date d'inscription samedi 25 avril 2015 Statut Membre Dernière intervention 2 janvier 2016 - Modifié par youssef.allmlg le 12/07/2015 à 02:43
animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 - 12 juil. 2015 à 15:17

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:

Mettre un texte en bas de page html
Supprimer une page word - Guide
Mettre un texte en majuscule - Guide
Mettre google en page d'accueil - Guide
Transcription audio en texte word gratuit - Guide
Excel cellule couleur si condition texte - Guide

1 réponse

Réponse 1 / 1

animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 737
12 juil. 2015 à 13:41

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 ....

youssef.allmlg Messages postés 44 Date d'inscription samedi 25 avril 2015 Statut Membre Dernière intervention 2 janvier 2016
12 juil. 2015 à 13:55

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.

animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 737
12 juil. 2015 à 14:13

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%;
}

youssef.allmlg Messages postés 44 Date d'inscription samedi 25 avril 2015 Statut Membre Dernière intervention 2 janvier 2016
12 juil. 2015 à 14:37

ç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.

animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 737
Modifié par animostab le 12/07/2015 à 15:18

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.

Discussions similaires

copie de texte