[Résolu] Aligner un footer en bas

Bonjour,

J'aimerais aligner un footer sur le bas de ma page mais je ne trouve pas la solution en CSS pour le faire.

Voici le code CSS du footer :

#footer-d {
background-image: url(design/fond-footer.png);
background-repeat: repeat-x;
height: 37px;
width: 100%;
text-align: center;
margin-bottom: 0px;
position: absolute;
bottom: 0px;
}

Ici ça marche, mais quand le contenu dépasse ça me fait ce bug : http://img.rock-hosting.com/view/2s723s-i32/

Comment faire pour que le footer reste toujours collé au bas de la page, mais que si le contenu augmente il le suit dans le flux ?

Voici la page entière si vous voulez faire des tests : http://chokgfx.free.fr/uploads/tracteurs_collection/description.html

Le code ayant été mal écrit depuis le début, je cherche surtout une façon de "bidouiller" pour que ça marche.

Merci.
Modifié par Chok71 (19 Apr 2010 - 00:17)

Il y a plusieurs tutoriels ou gabarits dispos ici et la .

je propose 3 gabarits : http://yidille.free.fr/plux/valign/?9-pied-en-bas-de-fenetre et la base qui semble t'interesser : http://yidille.free.fr/plux/valign/uploads/pied-coulissant.html

le pied coulissant est celui qui ressemble a ce que tu cherche a faire .
Quand tu as compris le principe de la mise en place des styles , le principe est alors applicable a différents niveau de ta structure html .
Tu peut partir sur html/body comme zone d'affichage principale (ce que tu cherche a faire) ou l'appliquer a une autre zone de la structure de ton document , comme la page d'entrée le démontre .

Bon apprentissage

Bonjour,

Enlever la position absolute déjà.

Pas forcement , tout depend comment tu te cale et comment tu habilles les fonds de ta page , si le pied de page est en largeur et hauteur fixe ou en fluide ...

du height et du min-height, du padding , du position relative et absolute , voir fixed si on veut rester a l'ecran et que l'on omet IE6 .

Pas de soluce universelle , il faut d'abord se faire un gabarit qui tiendra les principales zone de contenu et les fonds graphique .

La difficulté est toujours de choisir la technique la plus proche et la plus malléable et que l'on maitrise au mieux pour le résultat que l'on recherche .

Il y a d'autres des tutos ou gabarits , faites part de vos favoris .

Cordialement,
GC

Merci, mais je n'ai pas demandé un tutorial, mais une solution à mon problème. Ce genre de gabarits je sais déjà les faire.
Modifié par Chok71 (18 Apr 2010 - 17:28)

??

Si tu sais les faire tu devrais en comprendre le fonctionnement et en particulier les processus d'heritage et de comportement de height dans les differents navigateurs ...

#corps et .border-corps sont fixés a 100% en height ... donc résultat normal . Il n' y a que IE6 qui va laisser ces deux la s'allonger ....

Oui, la solution était dans ton deuxième lien (pied coulissant) : le min-height: 100%;...

Merci.
Modifié par Chok71 (19 Apr 2010 - 00:21)