Intégration HTML/CSS (entete largeur 100%)

Résolu/Fermé
Utilisateur anonyme - 4 sept. 2010 à 18:57
 gogui - 3 févr. 2011 à 00:05
Salut !

Je suis actuellement en train de créer un site internet. (Jusqu'ici tout va bien) Mais ! (Parce qu'il y a un mais) J'ai un problème d'intégration. En effet, mon entête et mon pied de page font tous les deux une largeur de 100%.

J'aimerais savoir comment faire pour que mon contenu, mon menu dans l'entête ainsi que le contenu de mon pied de page soient toujours centrés comme dans le site commentcamarche.net. Quand on joue avec la taille de la fenêtre le menu et le pied de page font toujours la largeur de la page et le contenu se centre.

Merci de m'avoir lu.
A voir également:

1 réponse

ben pour centrer soit la solution ici (en auto):
https://www.alsacreations.com/article/lire/539-Centrer-les-elements-ou-un-site-web-en-CSS.html

soit:
width : largeur max du site;
left : 50%;
margin-left : moins la moitié de la dite largeur;

Vu que ça calcule à partir du coin supérieur gauche du div

La version 2 contourne l'incompréhension de certains navigateurs.

Bref, il suffit de tester voir si il y a un souci ;-)

Si en %, préférer la solution 1
-1
Utilisateur anonyme
4 sept. 2010 à 21:14
Salut !! Merci de m'avoir répondu !

Pour la solution une, j'étais au courant mais dans mon cas ça ne marche pas.
Mon site a une largeur de 960px MAIS l'entête et le pied de page prennent la largeur de l'écran et ils ont du contenu aussi mais d'une largeur de 960px.

Veux-tu voir le code ?

Merci de m'avoir lu.
0
Utilisateur anonyme
4 sept. 2010 à 22:18
Salut !

Finalement j'ai réussi à régler mon petit souci.

Merci quand même.

Bye !!
0
Salut, je sais que c'est assez vieux mais :

Avec ceci tu va centrer tout ce qui se trouve dans le contenu (exemple sur ce forum : tous es texte que nous tapons ainsi que les pubs a droite sont dans une meme div et sont centrées)

A+


#header {
width: 100%
}
#main { //represente tout ton contenu qui ne se trouve pas dans header et footer
width: 900px;
margin: 0 auto 0 auto;
}
#footer {
width: 100%;
}
0