[Résolu] Div centre décalé sous IE

bonjour à tous

j'ai un (petit) souci d'affichage avec IE
voici les codes un peu épuré pour ici

le css

/* CSS issu des tutoriels css ----  www.alsacreations.com  */
body {
	background-color: #272727;
	font-family: "Trebuchet MS", Arial, Verdana, "Lucida Grande", Tahoma, Helvetica, Sans-Serif;
	color: white;
	font-size: 0.7em;
	margin: 0;
	padding: 0;
}
#global {
	background-color: #272727;
	margin: 0.5em auto;
	text-align: left;
	width: 760px;
	border: 1px solid #353b55;
}
#head {
	background-color: #273059;
	background: url('design/bd_bleu.jpg') no-repeat;
	height : 103px;
}
#centre {
	background-color: #272727;
	margin: 0 150px 0 150px;
	padding: 13px 0;
	width: 460px;
	text-align: left;
}
#gauche{
	float: left;
	background-color : #272727;
	width: 150px;
	text-align: center;
}
#droite{
	float: right;
	background-color : #272727;
	width: 150px;
	text-align: center;
}
#pied {
	clear: both;
	background:#273059 url('design/bd_dgrd_ble.jpg') repeat-y;
	padding: 2px 0;
	margin: 0;
	border-top: 2px groove black;
	width: 760px;
	height: 30px;
	font-size: 10pt;
	text-align: center;
	color: #bababa;
}

et le html qui va avec

<div id="global">
	<div id="head"></div>
	
	<div id="gauche">	
		<p class="rubrique">REGIONS</p>		
		<ul class="menugauche">
			<li><a href="">region 1</a></li>
			<li><a href="">region 2</a></li>
			<li><a href="">region 3</a></li>			
			<li><a href="">region 4</a></li>
		</ul>	
	</div>
	
	<div id="droite">			
		<p class="rubrique">PHOTOGRAPHES</p>	
		<ul class="menudroit">
			<li><a href="">photographe 1</a></li>
			<li><a href="">photographe 2</a></li>
			<li><a href="">photographe 3</a></li>			
			<li><a href="">photographe 4</a></li>
		</ul>
		
		<p class="rubrique">CATEGORIES</p>		
		<ul class="menudroit">
			<li><a href="">categorie 1</a></li>
			<li><a href="">categorie 2</a></li>
			<li><a href="">categorie 3</a></li>			
			<li><a href="">categorie 4</a></li>
		</ul>
	</div>

	<div id="centre">	
		<p class="standar">texte du paragraphe</p>
		<img src="design/france.jpg" />		
		<p class="standar">texte du paragraphe</p>
  	</div>
	
	<div id="pied"></div>
</div>

j'utilise un tuto venant d'alsacreations qui va super bien sous firefox

mais avec IE le div "centre" est bien centré dans la largeur mais
en dessous de mes menus alors qu'il devrait être entre eux bien sûr

quelqu'un aurait une idée ?

ça m'aiderais bien parce que la.. je patine ...

merci
Modifié par deepo (12 May 2006 - 14:27)

c'est le bug " 3px jog " d'IE qui attribue 3px de marge aux blocs .
pour resoudre soit diminuer la largeur des blocs soit ne pas attribuer de largeur a #center simplement margin-left: 150px; margin-right: 150px;

Salut

Essaye ca ca marche chez moi sur IE6 en s'affichant comme sur firefox 1.5

#centre {
	background-color: #272727;
	margin: 0 150px 0 150px;
	padding: 13px 0;
	width: 460px;
	text-align: left;
}

A+

super

alors là fallait savoir
quand je pense au temps que j'ai perdu la dessus depuis ce matin ...
j'suis vert

merci beaucoup

Ca nous arrive à tous. On cherche toujours ailleurs. Mais bon ce problème la je l'avais déja rencontré un jour quand j'adaptais des largeurs de colonnes. dès qu'il avait plus la place nécessaire dans mon conteneur, il passait tout en bas. Tu le sauras pour la suite