Sujet Précédent Sujet Suivant

[HTML/CSS] Pied de page

Résolu/Fermé
LuTo21 Messages postés 8 Date d'inscription mardi 16 juin 2009 Statut Membre Dernière intervention 18 juin 2009 - 17 juin 2009 à 14:43
LuTo21 Messages postés 8 Date d'inscription mardi 16 juin 2009 Statut Membre Dernière intervention 18 juin 2009 - 18 juin 2009 à 10:35
Bonjour,

J'ai mis un pied de page qui soit visible sur chaque page html de mon site par contre je n'arrive à centrer mon texte au centre. Il démarre du milieu de la page et donc se retrouve sur la droite. Voic mon CSS : 

* { margin:0;padding:0;}

html  { 
	height:100%;
	width:100%;
}
html img.imghtml, html div.imghtml{
	width:100%;height:100%;
	top:0;
	left:0;
	position:absolute;
}

html, html * {
	position:relative;
	z-index:0;
}
body {	top:0;
	left:0;
	position:absolute;
	z-index:1;
	width:100%;
	height:100%;
	overflow:hidden;
	color:#000;
	text-align:center;
}
#corps {
	width:100%; 
	height:100%;
	border:3px solid #000;
	margin:auto;
	border-top:0;
	border-bottom:0;
	overflow:auto;
}
#footer {
	position: absolute;
	bottom: 0;
	padding: 10px;
	width: center;
	color:#fff;
}


Et partie HTML pour le pied de page : 

<html>
<head>
<link href="test.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="footer">
	<font size=1>| © 2009 tous droits réservés | Plan d'accès | Contacter |				</font>

</body>
</html>


Pouvez-vous m'aider à trouver l'erreur?
Merci
A voir également:

9 réponses

Réponse 1 / 9
LuTo21 Messages postés 8 Date d'inscription mardi 16 juin 2009 Statut Membre Dernière intervention 18 juin 2009 3
18 juin 2009 à 10:35
Voici le code HMTL et CSS pour mettre un pied de page fixe sur chaque page et centré :


Fichier test.html : 

<html>
<head>
<link href="test.css" rel="stylesheet" type="text/css" />
</head>
<div id="footer">
  <div id="foot_interne">
	<font size=1>VOTRE TEXTE</font>
  </div>
</div>
</html>



Fichier test.css : 

#footer {
	position: absolute;
	bottom: 0;
	padding: 10px;
	width: 100%;
	color:#fff;
}
#foot_interne {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		text-align:center;
}
3
Réponse 2 / 9
LuTo21 Messages postés 8 Date d'inscription mardi 16 juin 2009 Statut Membre Dernière intervention 18 juin 2009 3
17 juin 2009 à 15:18
Un petit up pour une petite aide lol :)
0
Réponse 3 / 9
glabok Messages postés 131 Date d'inscription samedi 4 août 2007 Statut Membre Dernière intervention 24 avril 2020 40
17 juin 2009 à 15:48
Enlève simplement le position: absolute; de ton #footer .
Après je ne sais pas ce que va devenir ta mis en page, mais tu aura ton footer centré.
0
Réponse 4 / 9
LuTo21 Messages postés 8 Date d'inscription mardi 16 juin 2009 Statut Membre Dernière intervention 18 juin 2009 3
17 juin 2009 à 15:53
Oui j'avais testé d'enlever 
position: absolute;
mais mon texte ne se retrouve plus en pied de page fixe.
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 9
antoine
17 juin 2009 à 16:13
Dédolé mais qu'est ce que c'est que ce m... au début de la css ??????????

je cite "
html {
height:100%;
width:100%;
}
html img.imghtml, html div.imghtml{
width:100%;height:100%;
top:0;
left:0;
position:absolute;
}

html, html * {
position:relative;
z-index:0;
}"
????????
0
Réponse 6 / 9
LuTo21 Messages postés 8 Date d'inscription mardi 16 juin 2009 Statut Membre Dernière intervention 18 juin 2009 3
17 juin 2009 à 16:17
Il ne faut pas en tenir compte

il faut voir 
#footer {
	position: absolute;
	bottom: 0;
	padding: 10px;
	width: center;
	color:#fff;
}

le reste je l ai déjà supprimé car je faisais des tests. :)
0
Réponse 7 / 9
antoine
17 juin 2009 à 16:28
ok, mais c'est bizarre quand meme :

position: absolute;
bottom: 0;
c'est par rapport au coin sup gauche de la balise de type block #footer
ce serait donc plutot bottom : - (hauteur de la boite) px; a toi de faire le calcul en récupérant par JS (par exemple) la hauteur utile en fonction du visteur

width: center; qué sa ko ???
Plutôt
width : 980px
ou
text-align:center;
???
0
Réponse 8 / 9
Ozimandias Messages postés 502 Date d'inscription jeudi 14 mai 2009 Statut Membre Dernière intervention 10 mars 2010 46
17 juin 2009 à 16:32
On ne peut pas centrer automatiquement une div en absolute donc on crée une div dans le div.
Le HTML: (je me sert de ton footer comme conteneur) 

<div id="footer">
  <div id="foot_interne">
	<font size=1>| © 2009 tous droits réservés | Plan d'accès | Contacter |</font>
  </div>
</div>


Le CSS: 

#footer {
	position: absolute;
	bottom: 0;
	padding: 10px;
	width: 100%;
	color:#fff;
}

#foot_interne {
        position: relative;
        margin-left: auto;
        margin-right: auto;
	width: 150px; // ici tu met la taille dont tu as besoin, pas plus
}


ça devrai marcher.
0
Réponse 9 / 9
LuTo21 Messages postés 8 Date d'inscription mardi 16 juin 2009 Statut Membre Dernière intervention 18 juin 2009 3
17 juin 2009 à 17:00
Merci je vais tester tout ça !
0

Discussions similaires

waze piétons
ANNY -
bendrop -

2 réponses