Centrer les éléments ou un site web en CSS

bonjour...
j'essaye de centrer un page.. mais cela ne fonctionne pas.. pourtant j'ai trouver sur le site le code CSS... mais comme je debute c'est pas facile pour moi...
j'ai placé cela au debut de ma page HTML

<style type="text/css">
#global {margin: 0 auto;}
</style>

ensuite sous body j'ai mis cela

<div id="global">

et a la fin </div>

mais cela ne marche pas ma page est toujours sur la gauche.. et j'aimerais quel que sois la resolution.. quel soit toujours au centre..

Merci a vous

Hello star42 et bienvenue,

pour que le margin: auto fonctionne il faut obligatoirement renseigner une largeur (width) à #global.

Peut-être que le mieux serait de reprendre du début. Un petit tour sur cet article : comment débuter et trouver l'information ?, ainsi que dans les Tutoriels et dans la FAQ devrait déjà bien t'informer sur les standards du web et la manière de faire un site conforme.

Bonne continuation .

Bonsoir

As tu lu:
- Le tutoriel présent sur ce site, jusqu'au bout?

oui j'ai le tutos qui parle du centrage.... mais je dois faire une erreur.. j'ai aussi essayer cela.. mais cela ne marche pas...

#global {
margin-left: auto;
margin-right: auto;
width: auto;
}

Pas de chance : il faut une valeur explicite pour que cela fonctionne (ex: 600px) mais pas auto qui est la valeur par défaut de cette propriété.

PS : pour conserver une bonne lisibilité des messages sur le forum, il est demandé d'utiliser les balises code pour présenter le code source des exemples.
Pourrais-tu éditer ton message pour te conformer à cette règle de mise en forme ?
Merci d'avance.

oui mais si je place une valeur... et si je change de résolution l'écran se sera plus centrer !!! et je désire garder l'écran centrer quel que soit la taille de l'écran..merci
Modifié par star42 (12 Nov 2008 - 11:17)

star42 a écrit :
oui mais si je place une valeur... et si je change de résolution l'écran se sera plus centrer !!! et je désire garder l'écran centrer quel que soit la taille de l'écran..merci

Houlà... on refait la même mais en français et sans utiliser le même mot (écran) pour parler de choses différentes?

On a donc:
- une zone de visualisation du navigateur, dans laquelle s'affiche ta page web;
- un conteneur pour ton site, qui peut être l'élément BODY ou un élément DIV qui regroupe l'ensemble des contenus.

La largeur de la zone de visualisation du navigateur peut varier, suivant la résolution de l'écran, si l'utilisateur réduit la fenêtre du navigateur (courant sur les grands écrans), etc.

Pour centrer le conteneur de ton site, ce dernier doit avoir une largeur fixe (par exemple: width: 600px), et utiliser les marges automatiques pour le centrage. Comme expliqué par Heyoan et dans l'article qu'il t'indique. Quelle que soit la largeur de la zone de visualisation du navigateur, le centrage sera effectif si tu utilises bien une largeur spécifique et les marges automatiques.

Bonjour..
nouvelle ici, je m'incruste sur ce post pour la même question..

Donc un site en css, qui s'affiche comme je veux qur certaines machines, et pas du tout sur d'autres.. sans que cela semble avoir de rapport avec la plateforme ou le navigateur (enfin si, sur firefox ça semble bien fonctionner, le reste ça semble aléatoire)
Je vous donne mon code :

#general {
 width: 820px;
 padding:0;
 margin: 200px auto 0 auto;
}

avec un body :

body {
 font-family:"trebuchet MS", Verdana, Arial;
 font-size:13px;
 color: #111;
 line-height: 15px;
 margin: 0px;
 background-attachement:fixed;
 background-color: #ffffff;
 background-image: url(fond.jpg);
 background-repeat: repeat-y;
 background-position: center top;
}

j'ai tenté de suivre le tuto du site, et j'ai donc rajouté à #general :

 text-align: left;

mais rien n'y fait..
Je me suis posé la question du Doctype, mais comme j'ai un peu de mal encore avec le css (même avec les tutos ) je n'arrive pas à savoir si ça a vraiment un rapport ou pas et si oui, lequel je suis censée utiliser..
si quelqu'un peut m'aiguyer
merci d'avance !

Bonjour,

Si tu n'as pas du tout utilisé de Doctype, ou si tu as utilisé un Doctype HTML 4.01 Transitional sans URL de la DTD (on reprend son souffle...), alors oui ça a tout à voir et ça explique ton problème.

Fais une petite recherche sur le mode de compatibilité des navigateurs, plus communément appelé «mode Quirks». On en parle notamment dans les tutoriels d'Alsacréations, et ça fait partie des notions indispensable à maitriser.

merci, même si j'ai encore du mal à saisir !
C'est un site en spip que je développe (comme je peux)
actuellement le doctype est le suivant :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

j'ai lu les tutos à l'instant pour le mode quirks et les différents doctype.. bien compris pour le mode quircks (et du coup je suppose que ça vient bien de ça puisque ça n'est pas que le general ne soit pas centré mon problème mais un décalage entre le general et le body, léger mais suffisant pour que ça ne ressemble à rien). Je vais bien relire le doc sur les doctypes et tenter de des expériences (pas simple puisque chez moi, sur les 2 ordis et les différents navigateurs dont je dispose, ça fonctionne bien... donc obligée de demande à chaque fois à une copine ce que ça fait chez elle)

merci encore en tout cas

je m'arrache les cheveux... j'ai vérifier que le doctype était bien sur toutes les pages le même, à savoir
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
qui m'a l'air d'être le bon si j'ai bien tout compris.. or la copine qui teste pour moi, m'a dit que l'une des rubrique de mon site s'affichait bien mais pas les autres... or c'est la même feuille de style, les même balises, etc... enfin au moins il y a une page qui fonctionne...

willybob a écrit :
(et du coup je suppose que ça vient bien de ça puisque ça n'est pas que le general ne soit pas centré mon problème mais un décalage entre le general et le body, léger mais suffisant pour que ça ne ressemble à rien)

Oui sauf que là, à priori, tu n'es pas en mode Quirks. Il est de combien ce décalage? Un pixel? Trois pixels?