High-Tech Santé Médecine Droit-Finances

Télécharger

MSN 2009

Rechercher : dans
Par :

[HTML/CSS] Pied de page

Dernière réponse le 18 jun 2009 à 10:35:48 LuTo21, le 17 jun 2009 à 14:43:18 
 Signaler ce message aux modérateurs

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
Configuration: Windows XP Internet Explorer 7.0

Meilleures réponses pour « [HTML/CSS] Pied de page » dans :
Créer un site beau, dynamique et respectueux des standards VoirVoici une liste de liens qui vous aideront à mieux exploiter les standards (HTML, CSS, DOM...) pour créer des sites plus beau, plus dynamiques et plus respectueux des standards. A la fin de cette page, il y a également une liste de...
Télécharger PSPad VoirPSPad est un excellent éditeur de texte. Il est utile pour travailler sur du simple texte, mais aussi sur du HTML, CSS, Javascript, php ou autres langages de programmation (C++, Java, Python...). Les fonctionnalités sont impressionnantes: ...
Structure d'un document HTML VoirNotion de document HTML Une page HTML est un simple fichier contenant du texte formatté avec des balises HTML. Par convention l'extension donnée au fichier est .htm ou .html, mais une page web peut potentiellement porter n'importe quelle...
Posez votre question Répondre

1

LuTo21, le 17 jun 2009 à 15:18:54

Un petit up pour une petite aide lol :)

   
Répondre à LuTo21

2

glabok, le 17 jun 2009 à 15:48:26

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é.

   
Répondre à glabok

3

LuTo21, le 17 jun 2009 à 15:53:16

Oui j'avais testé d'enlever 

position: absolute;
mais mon texte ne se retrouve plus en pied de page fixe.

   
Répondre à LuTo21

4

antoine, le 17 jun 2009 à 16:13:19

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;
}"
????????

   
Répondre à antoine

5

LuTo21, le 17 jun 2009 à 16:17:33

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. :)

   
Répondre à LuTo21

6

antoine, le 17 jun 2009 à 16:28:02

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;
???

   
Répondre à antoine

7

Ozimandias, le 17 jun 2009 à 16:32:29

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. Deux intellectuels assis vont moins loin qu'une brute qui marche.
!!! Vous avez obtenu une réponse ... Pensez à marquer vos sujets comme résolus !!!

   
Répondre à Ozimandias

8

LuTo21, le 17 jun 2009 à 17:00:39

Merci je vais tester tout ça !

   
Répondre à LuTo21

9

 LuTo21, le 18 jun 2009 à 10:35:48

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;
}

   
Répondre à LuTo21
Posez votre question Répondre
Ils ont besoin de votre aide