[resolu] Problème : bottom et absolute

Sur un pied de page, j'ai un problème plutôt bizarre. En effet sur Mozilla lors du premier chargement, le pied de page ne colle pas au bas du navigateur.

http://n.lescuyer.free.fr/tampon/avant.jpg

Si je "reload" la page, celle-ci s'affiche correctement. Et le problème n'existe pas sur IE :

http://n.lescuyer.free.fr/tampon/apres.jpg

pied de page CSS :

#skin-pied {
	position: absolute;
	bottom: 2px;
	display: block;
	width: 880px;
	text-align: center;
	font-size: 11px;
	color: #666666;
	clear: both;
}

adresse de la page pour tester vous même :
http://www.bugpics.com

j'ai oublié, l'astuce employée pour tenir sur toute la page, c'est peut être aussi une source d'erreur :

#feuille {
	width: 880px;
	position: absolute;
	left: 50%;
	margin-left: -440px;
	background: #FFFFFF url('/system/images/sk_feuille.jpg');
	height: 100%;
}

html>body #feuille {
	height: auto;
	min-height: 100%;
} 

Modifié par bugpics (25 Oct 2005 - 21:28)

Hello bugpics et bienvenue ici

Attention à bien lire le message qui apparait en bandeau au dessus du forum.
Il te donnera les indication minimales nécessaires au bon emploi de ce forum.
Par exemple dans ton cas, tu n'as pas respecté les indications pour afficher tes codes proprement.

Veux-tu bien les relire (ce sont les mêmes règles que tu as accepté en t'inscrivant) et modifier ton message pour les appliquer ?

Merci d'avance

corrigé

personne n'a une idée du problème car pour l'instant je suis à sec de solution.

j'ai eu le même problème sur mon site je l'ai réglé en insérant <div style="clear:both"></div> en fin de ma colonne centrale, c'est pas très "propre" mais c'est tout ce que j'ai trouvé pour résoudre ce soucis.

Correctif

en fait le problème survient si ma colonne centrale est moins "haute" que ma colonne de droite donc je peux virer <div style="clear:both"></div>

il y a de forte chance pour que chez toi ce soit aussi un truc du même genre...
Modifié par Exo7 (20 Oct 2005 - 12:10)

cette solution ne marche apparement pas. malheureusement.

il se passe quelque chose de bizarre avec le cache. car comment une page peut etre afficéhe de deux manières différentes sans modification à part avec un bug de firefox !

je reste perplexe face à ce problème.

j'ai trouvé le problème. Il semble que le paramètre "position : absolute" pose des problème à Firefox lorsqu'il est mal utilisé.

cette version marche parfaitement :

#skin-pied {
	bottom: 0;
	width: 880px;
	text-align: center;
	font-size: 11px;
	color: #666666;
}

mea culpa
Modifié par bugpics (25 Oct 2005 - 21:27)

bugpics a écrit :
j'ai trouvé le problème. Il semble que le paramètre "position : absolute" pose des problème à Firefox lorsqu'il est mal utilisé.

Non. Firefox supporte complètement et correctement le positionnement absolu.

Ps : inutile d'indiquer la règle "bottom : 0" dans ton code puisque cette propriété ne s'applique que si l'élément est positionné (absolu, fixe ou relatif), ce qui n'est pas le cas.

Le positionnement absolu sort l'élément du flux, donc il est normal que le reste (en flux) soit gêné ou caché.

Il faut effectivement ne pas utiliser de positionnement absolu, pour laisser tous les éléments en flux, ou alors utiliser le positionnement flottant et placer le pied de page en dessous avec un clear.
Modifié par Raphael (25 Oct 2005 - 21:39)

tres bien vu :

#skin-pied {
	width: 880px;
	text-align: center;
	font-size: 11px;
	color: #666666;
	clear: both;
}

c'est d'ailleurs plus propre et ça marche parfaitement.

ps : il ne faut pas se tromper sur mes propos je disais que firefox avait du mal quand on faisait n'importe quoi en css. Quand on ecrit mal il ne faut pas s'étonner que les autres ne comprennent rien.

Il me semble d'ailleurs plus sensible aux erreurs que IE.
Modifié par bugpics (25 Oct 2005 - 21:52)