28220 sujets

CSS et mise en forme, CSS3

Pied de page volant ! :p

Slut

J'ai un petit problème (uniquement sous Firefox), j'ai créé le site :
http://roro.heb.free.fr/ppe_train_diff/

Et il se trouve que mon pied de page "©2005 Design and Website Engine's Code by RorolePro... etc... " ne reste jamais à la même place!

Il devrait toujours être positionné sous le div centre mais bien souvent, il se retrouve par dessus et je ne comprends pas pourquoi :s

Une petite aide me serait nécessaire, merci bien Smiley cligne
Bonjour.
Ta div.footer est en position absolute avec margin-top de 20px. Ce .footer est lui même inscrit dans une div.centre elle même en position absolute. Je crois que si tu met le .foot en relative ou même sans aucune indication (static par défaut), ça devrai corriger. Il faudra peut-être passer aussi .centre en relative pour ne pas voir monter le pied de page encore plus haut..
PS, sur FireFox chez moi (Mac) c'est bien positionné, par contre c'est sur Opera que le foot rentre dans le paragraphe précédent.
Je viens de m'apercevoir que sur une autre page; celle qui montre la maquette en Lego, le pied de page se trouve au milieu du texte. Au dessus et superposé à l'image du diagrame de distribution des puissances. Donc, avec ça, je suis certain que c'est position absolute qui te joue des tours.
Modifié par Aureance (04 Jul 2005 - 15:12)
Alors, si je mets une position relative pour mon bloc footer, il se retrouve sous le texte du bloc center mais toujours dans le bloc center alors que j'aimerais qu'il se place sous le bloc footer! Normal me direz-vous, puisque mes blocs sont placés de cette manière dans mon code XHTML, mais le problème, c'est que si je mets le bloc footer sous le bloc center avec un footer en position relative, il se retrouve aligné en haut de page !

Personne n'a une autre idée pour résoudre mon problème ?
Bonjour,

Juste une remarque en passant, le div de pied de page correspond plus à un "id" qu'à une "class" puisqu'il est supposé être unique dans une page. De plus le div à ce que je sache est déjà un élément de type block par défaut qui prend 100% de la largeur de l'élément parent.


#footer {
	margin-top : 20px;
	text-align: center;
	font-size: 80%;
}


devrait te donner un résutat équivalent.

Ensuite, tu n'est pas obligé de tout positionné en absolu, tu peux essayer en relatif.


.foot {
	display: block;
	position: absolute; /* relative */
	width: 100%;
	margin-top: 20px;
	text-align: center;
	font-size: 80%;
}


Après je suis pas fan/expert du positionnement absolu, mais je pense que t'aurais pu faire la même chose en "flottant" simplement le div du menu gauche non ? Ce ne sont pas les templates qui manquent comme exemples.
DirtyF a écrit :
Juste une remarque en passant, le div de pied de page correspond plus à un "id" qu'à une "class"

en effet, j'ai partout utilisé des class, je n'ai pas fais de différence entre class et id Smiley ohwell

DirtyF a écrit :
De plus le div à ce que je sache est déjà un élément de type block par défaut

en effet et j'avais effectué la modification en local Smiley cligne

DirtyF a écrit :

Ensuite, tu n'est pas obligé de tout positionné en absolu, tu peux essayer en relatif.

Comme la suggéré Aureance, j'ai essayé avec des positions relative mais avec des positions relative, mon footer se retrouver alignée en haut de page, ce qui m'étonne d'ailleurs :s
C'est ici que j'ai entendu parler de la différence entre class et id mais comme tu l'écris toi-même :
"Note : En suivant quelques tutoriels d'Alsacréations, vous remarquerez sans-doute quelques incohérences par rapport à cet article, notamment des utilisations de class alors qu'un id aurait été plus approprié. Vous mettrez ces incohérences sur le compte de la jeunesse : quelques tutoriels sont un peu vieillots ! Smiley smile "
Et j'avoue avoir la flemme de changer maintenant! Mais j'attache quand même une certaine importance à mon problème principale qui le positionnement de mon pied de page ! J'ai toujours pas réussi à faire comme je le souhaite :s
Sujet clos
Aller à