Alignement horizontal

Bonjour à vous,
voilà j'ai réalisé un site qui a une mise en page centré, toute fois je découvre qu'il y a quand même un tout petit décalage sur la droite.
J'ai relu a plusieurs reprises tout mon code mais à force on ne voit plus rien

Voici l'adresse web http://www.parfumshantara.com/index.php?option=com_content&view=article&id=18&Itemid=13


Et voici mon css

#conteneur
{
width: 802px;
height: 820px;
margin-left:-400px;
text-align: center;
position: absolute;
left: 50%;
margin-top:30px;
margin-bottom: 30px;

}

#entete {
background-image: url(../images/shantara_pure_q.png);
background-repeat: no-repeat;
height: 56px;
width: 250px;
text-align: center;
margin-bottom: 10px;
margin-right: auto;
margin-left: auto;
}

#contenu {
height: 600px;
width: 800px;
border: 1px solid #999;
margin-right: auto;
margin-left: auto;
margin-bottom: 0px;
font-family: helvetica;
text-align:center;

}

#contenu h1 {
font-variant: small-caps;
font-size: 24px;
margin-top: 120px;
width: 800px;
color: #666;
}

#contenu h2 {
font-variant: small-caps;
width: 800px;
font-size: 20px;
color: #666;
}

#contenu p {
font-size: 16px;
width: 700px;
padding-left: 60px;
padding-right: 60px;
color: #666;
}

#contenu p a {
color: #000;
text-decoration: underline;
}

#contenu p a:hover {
color: #999;
text-decoration: underline;
}

#contenu p a:visited {
color: #000;
text-decoration: underline;
}

#contenu p2 {
font-size: 11px;
width: 700px;
color: #666;
}

#contenu p2 a {
color: #000;
}

#contenu p2 a:hover {
color: #999;
}

#menu {
margin-right: auto;
margin-left: auto;
height: 30px;
font-size: 14px;
font-family: helvetica;
}


#menu ul li a {
text-decoration: none;
color: #000;
margin: 0px;
}

#menu ul li a:hover {
color: #999;
}

#menu ul li {
display: inline ;
list-style-type: none;
font-variant: small-caps;
color: #000;
padding-left:10px;
padding-right: 10px;
margin: 0px;
}

#entete_basse {
margin-right: auto;
margin-left: auto;
height: 51px;
width: 211px;
background-image: url(../images/parfum_des_origines.png);
margin-top: 5px;
}

#pied {
height: 22px;
width: 800px;
margin-right: auto;
margin-left: auto;
text-align: right;
font-family: helvetica;
color: #999;
font-size: 11px;
}
#pied a {
color: #999;
text-decoration: none;
}
#pied p a:hover {
color: #666;
}

Voilà....
Merci d'avance pour votre aide !

Salut et bienvenue parmi nous

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle.

Bonne continuation

Et l'eau,

J'ai lu ton code en biais et je pense que ton soucis vient du fait qu'il manque une règle sur l'élément body :

body{
	margin:0;
	padding:0;
}

@+

salut
pour ton conteneur
enlève la position: absolute;, le left: 50%; et margin-left:-400px; à la palce tu mets: margin: auto;:

#conteneur
{
width: 802px;
height: 820px;
margin: auto;
text-align: center;
margin-top:30px;
margin-bottom: 30px;

}

Bonjour,

merci pour vos astuces que j'ai pu appliquer, hélas mon menu horizontal lui restait décalé, alors j'ai farfouillé un peu et je suis tombée sur ce super tuto pour les menus horizontaux

http://www.siteduzero.com/tutoriel-3-37440-un-menu-horizontal.html


Et oui il faut donner la valeur de 0 au margin et padding de la balise ul pour éviter l'indentation de la liste (automatique en XHTML) et les marges qui ne seraient pas souhaitées : histoire d'éviter que le menu soit carrément décalé.

Merci pour votre soutien!