[Résolu] Centrer verticalment mon conteneur a mon body

Bonjour a tous, je sus un peu bloqué, j'essaye de centrer mon conteneur a mon body mon conteneur, mais il reste toujours tout en haut alors que de gauche a droite c'est centrer.


J'ai chercher avec mon ami google sur le net, essayé deuc trois methode mais toujours pareil, j'ai essayé aussi la methode qui est sur ce site (Les marges négatives) et que j'ai apri en cours mais ca ne foctionne pas, j'pense que j'ai du faire une erreur dans mon CSS...


Si vous pouviez me dir s'que vous en penser....

*{
	list-style-type: none;
	margin : 0px;
	padding:0px;
}
body{

	font-family: "Times New Roman", Times, serif;
	height: 100%;
	width: 100%;
	background-color: #ececec;
	text-align: center;
}

.centrer {
  margin-left: auto;
  margin-right: auto;
  width : 1000px;
  text-align : left;  /* pour résoudre le bug de centrage de IE */
}


/* -----------  Div principal (ou conteneur)*/

#conteneur{
	position: relative;
	
	left: 50%; 
   top: 50%;
	margin-top: -265px; /* moitié de la hauteur */
   margin-left: -500px; /* moitié de la largeur */
	width: 1000px;
	height: 530px;
	background-image: url(../image/fond_site.jpg);
	background-repeat: no-repeat;
	
	
}

/*-------------Div du menu gauche qui sera en Flash */

#menu_gauche{
	width: 200px;
	height: 500px;
	background-image: url(../image/menu_gauche.jpg); 
	
} 

/*-------------------Div du menu du haut */

#menu_haut{
	position: absolute;
	top: 0px;
	width: 550px;
	height: 100px;
	margin-left: 200px;
	background-image: url(../image/menu_haut.jpg);
	
	
}

/*-------------Div du relief droit */

#relief_droit{
	position: absolute;
	top: 0px;
	margin-left: 750px;
	width: 10px;
	height: 500px;
	background-image: url(../image/relief_droit.jpg);	
}

/*--------------Div de l'image Flash Creation d'entreprise*/


#crea_entr{
	position: absolute;
	top: 20px;
	margin-left: 760px;
	width: 230px;
	height: 80px;
	background-image: url(../image/crea_entreprise.jpg);
	
}

/*-------------Div de l'image derniere création */

#dern_crea{
	position: absolute;
	margin-left: 760px;
	top: 100px;
	width: 230px;
	height: 70px;
	background-image: url(../image/dernier_crea.jpg);
}

/*-------------Div de l'image Flash affiche */

#affiche{
	position: absolute;
	margin-left: 760px;
	top: 170px;
	width: 230px;
	height: 160px;
	background-image: url(../image/affiche.jpg);
	
}

/*-----------------Div de l'image information */

#information{
	
	position: absolute;
	margin-left: 760px;
	top: 330px;
	width: 230px;
	height: 60px;
	background-image: url(../image/information.jpg);
	
}

/*----------Div de la parie E_mail */

#e_mail{
	position: absolute;
	margin-left: 760px;
	top: 390px;
	width: 230px;
	height: 110px;
	background-image: url(../image/e_mail.jpg);
	
}



/*------------------Div bas de page avec l'ombre */ 


#bas_page{
	margin-left: auto;
	margin-right: auto;
	width: 1000px;
	height: 30px;
	background-image: url(../image/bas_page.jpg);
	background-repeat: no-repeat;
	
}

Merci d'avance!!!
Modifié par Chat (09 Apr 2008 - 10:29)

Un simple

margin: 0 auto

dans ton conteneur devrait suffire nan ?

Bonjour et bienvenue,

le code CSS c'est bien mais il s'applique à quel code HTML?
Si tu as un exemple en ligne à nous proposer, ce sera encore beaucoup plus simple, avec Firebug

Est-ce que tu as jeté un coup d'oeil à la FAQ qui propose plusieurs méthodes?

Guillaume Ringuenet a écrit :
Un simple

margin: 0 auto

dans ton conteneur devrait suffire nan ?

J'ai essayer et sa ne fonctionne pas, je me retrouve comme au depart...


http://img249.imageshack.us/my.php?image=norrmalgi5.jpg

Felipe a écrit :
Bonjour et bienvenue,

le code CSS c'est bien mais il s'applique à quel code HTML?
Si tu as un exemple en ligne à nous proposer, ce sera encore beaucoup plus simple, avec Firebug

Est-ce que tu as jeté un coup d'oeil à la FAQ qui propose plusieurs méthodes?

Desoler j'ai oublié le HTML et j'ai regardé dans la FAQ mais a moin que je m'y suis mal pri, sa n'avait pas l'air de fonctionner...

d'ailleur en utlisant la methode des marges négative sa me donne autre chose...

J'vous met ue capture d'ecran avec IE et Firefox....

http://img329.imageshack.us/my.php?image=explsx6.jpg

http://img329.imageshack.us/my.php?image=firemn2.jpg

<body>
<div class="centrer" id="conteneur">

       <div id="menu_gauche"></div>
      
       <div id="menu_haut"></div>
       
       <div id="contenu"></div>

       
       		   <div id="relief_droit"></div>
       			
               <div id="crea_entr"></div>
                 
               <div id="dern_crea"></div>
                
               <div id="affiche"></div>
                 
               <div id="information"></div>
                 
               <div id="e_mail"></div>
      
       
       <div id="bas_page"></div>
</div>
</body>

Edit: j'vous ai mi les lien des screen, j'ai pas reussi a les poster en images, desoler...
Modifié par Chat (08 Apr 2008 - 20:44)

Bonsoir chat,

Il est possible que les petits tests de l'ami Florent V. puissent te venir en aide :
http://web.covertprestige.info/test/39-centrage-bloc-vertical-horizontal.html

A voir

Cdt,
Sylvain

oui , et ce sujet a eté maintes fois posé ici , et la seule methode 'solide' et qui passe partout est un tableau d'une cellule !

Cette affirmation devient 'enfin' facile a faire et a répeter , finis les integristes anti-tableaux , à bas les marges négatives , (fausse bonne methode) !

On regretteras quand même les tentatives diverses css , bien souvent muselé par IE (et certains 'academiciens'), mais qui aident tellement a observé et comprendre les differents comportement des navigateurs, sans apporté de solutions miracles , de fils en aiguilles , elles aides a sortir ou eviter d'autre faux pas .

Il manque en fait un espace "bidouilles" ou "vrai fausses bonnes solutions" sur ce Forum , histoires de ne pas seulement mettre en avant des methodes académique réputées fiable , mais aussi de mettre en garde sur celle qui peuvent faire mal , car a ce jour , aucun navigateur n'implemente tout css et encore moins de façon identiques à chacun ces bugs et particularités .

Sans troll , tableau conseillé .

Ok, merci por vos reponses, je test et je vous tiens au courant!!!

J'ai juste ajuster et suprimer quelque parametre par raport a mon code et ca fonctionne, merci beaucoup pour votre aide!!!