Pied de page qui ne se place pas en bas de la page...
Résolu
chantaussel
Messages postés
137
Date d'inscription
Statut
Membre
Dernière intervention
-
chantaussel Messages postés 137 Date d'inscription Statut Membre Dernière intervention -
chantaussel Messages postés 137 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
Les pages de mon site sont composées de 3 div, <div id="entete">, <div id="corps">, <div id="pied_de_page">, qui se succèdent les unes à la suite des autres dans la div <body>
J'ai donné une min-height: 100% à la div "corps" dans le CSS, et malgré cela lorsque le texte de la page est très court, le "corps" ne descend pas jusqu'en bas et le pied de page se retrouve au milieu de la page.
Je tourne en rond depuis un moment, si quelqu'un voit d'o vient le problème?
Merci d'avance :)
Code CSS:
Page HTML:
Les pages de mon site sont composées de 3 div, <div id="entete">, <div id="corps">, <div id="pied_de_page">, qui se succèdent les unes à la suite des autres dans la div <body>
J'ai donné une min-height: 100% à la div "corps" dans le CSS, et malgré cela lorsque le texte de la page est très court, le "corps" ne descend pas jusqu'en bas et le pied de page se retrouve au milieu de la page.
Je tourne en rond depuis un moment, si quelqu'un voit d'o vient le problème?
Merci d'avance :)
Code CSS:
body
{
font-family: "trebuchet ms", sans-serif;
margin: 0px;
text-align: justify;
background: url("papier.jpg");
}
#corps
{
min-height: 600px;
font-size: 16px;
color: #B81B16;
padding: 20px;
}
#page
{
width: 970px;
margin-left: auto;
margin-right: auto;
padding: 40px 60px 40px 60px;
background: rgba(255,246,215,0.5);
border-radius: 25px;
}
#pied_de_page
{
background: #B81B16;
margin-left: auto;
margin-right: auto;
border-top: 4px solid #B81B16;
margin-top: 20px;
box-shadow: 0px -1px 10px 8px #711E00;
width: 100%;
}
Page HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" > <head> <meta http-equiv="X-UA-Compatible" content="IE=edge"/> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link rel="stylesheet" media="screen" type="text/css" href="style.css" /> <title>Mon titre</title> </head> <body> <div id="entete"> <h1>Titre site</h1> </div> <div id="corps"> <div id="page"> <h2>Titre</h2> <p>Blablabla</p> </div> </div> <div id="pied_de_page"> <p>Blablabla</p> </div> </body> </html>
A voir également:
- Pied de page qui ne se place pas en bas de la page...
- Impossible de supprimer une page word - Guide
- Mettre google en page d'accueil - Guide
- Numéro de page word - Guide
- Imprimer tableau excel sur une page - Guide
- Bordure de page word - Guide
3 réponses
Le site est (supprimé par la modération à la demande de l'auteur)
Et non, je ne veux pas que le footer soit toujours visible, je veux qu'il apparaisse en bas de la page quand on descend avec l'ascenseur (si la page est longue), et que le corps descende au moins jusqu'en bas de l'écran (si la page est courte), et que du coup le footer apparaisse tout en bas.
Sur un petit écran tout est ok, mais sur un grand écran le corps ne descend pas jusqu'en bas de l'écran et le pied de page se retrouve au milieu.
Merci!
Quelques bases en javascript, débute en php/mySQL
J'essaie de mettre en ligne mon arbre généalogique.
Et non, je ne veux pas que le footer soit toujours visible, je veux qu'il apparaisse en bas de la page quand on descend avec l'ascenseur (si la page est longue), et que le corps descende au moins jusqu'en bas de l'écran (si la page est courte), et que du coup le footer apparaisse tout en bas.
Sur un petit écran tout est ok, mais sur un grand écran le corps ne descend pas jusqu'en bas de l'écran et le pied de page se retrouve au milieu.
Merci!
Quelques bases en javascript, débute en php/mySQL
J'essaie de mettre en ligne mon arbre généalogique.
Salut,
Si tu l'avais en ligne ce serait plus rapide pour t'aider.
Tu veux que ton footer soit toujours en bas de l'écran ? Si c'est le cas, il faut mettre position:fixed;bottom:0px; dans le css du div du footer.
Si tu l'avais en ligne ce serait plus rapide pour t'aider.
Tu veux que ton footer soit toujours en bas de l'écran ? Si c'est le cas, il faut mettre position:fixed;bottom:0px; dans le css du div du footer.
Problème résolu, merci!
En fait, en lisant des trucs par ci par la j'ai réalisé que ne mettre le pied de page en bas de l'écran a tout prix (quelque soit la hauteur du contenu du texte) ne se fait pas. Je n'ai d'ailleurs pas réussi à le faire.
Visiblement, le plus correct c'est de coller le pied de page au corps de la page, puis accepter le fait qu'il y ai le fond qui continue "tout seul" jusqu'en bas de l'écran.
Voili voilou!
Visiblement, le plus correct c'est de coller le pied de page au corps de la page, puis accepter le fait qu'il y ai le fond qui continue "tout seul" jusqu'en bas de l'écran.
Voili voilou!
