Décalage FF-Chrome/IE 10

Bonjour à tous,

Je suis actuellement en train de développer un site internet. Je l'ai validé par le W3C (en tant que HTML 5). Cependant, un décalage subsiste entre Firefox et Internet Explorer 10. Impossible pour moi d'intégrer un commentaire conditionnel au vue du la version d'IE.

Voici l'affiche normal sur Firefox :
http://www24.zippyshare.com/v/94886375/file.html

Et l'affichage décalé sur IE :
http://www13.zippyshare.com/v/90653746/file.html

Tous les éléments sont intégrés dans un wrapper :

#wrapper {
	margin : 0 auto 0 auto;
	width : 940px; height : 820px;
}

Je vous épargne le début du code HTML, et commence à partir du premier élément qui a un problème d'affichage :

		
<DIV ID = "navig">
			<UL>
				<LI><A HREF = "#"> PRÉSENTATION </A></LI>
				<LI><A HREF = "#"> RÉALISATIONS </A></LI>
				<LI><A HREF = "#"> CONTACT</A></LI>
			</UL>
		</DIV> <!-- nav -->
		
		<IMG SRC = "img_01/band2.png" ID = "band_03" ALT = "Bandeau" />
		
		<DIV ID = "title_02" >
			<H1> LOREM IPSUM </H1>
		</DIV> <!-- title -->
		
		<DIV ID = "txt04" >
			<P>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </P>
		</DIV> <!-- txt04 -->
		
		<DIV ID = "txt05" >
			<P>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </P>
		</DIV> <!-- txt05 -->
		
		<DIV ID = "txt06" >
			<P>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </P>
		</DIV> <!-- txt06 -->
		
		<IMG SRC = "img_01/logo_footer.png" ID = "logo_footer" ALT = "Logo Footer"  />
		
		<DIV ID = "contact" >
		<P> 02 99 ** ** ** <BR /> 
		contact@entreprise.com </P>
		</DIV> <!-- contact -->

	</DIV> <!-- "wrapper" -->

Et voici le code CSS :

#navig {
	margin : -762px 0 0 658px;
}

#band_03 {
	margin : 4px 0 20px 659px;
}
#title_02 {
	margin : 93px 0 0 658px;
	color : black;
}
#txt04 {
	margin : 27px 0 0 660px;
	color : black; 
	width : 270px; height : 88px;
	text-align : justify;
}
#txt05 {
	margin : 27px 0 0 660px;
	color : black; 
	width : 270px; height : 88px;
	text-align : justify;
}
#txt06 {
	margin : 27px 0 0 660px;
	color : black; 
	width : 270px; height : 88px;
	text-align : justify;
}
#logo_footer   {
	margin : 20px 0 0 658px;
}
#contact {
	font-size : 18px;
	color : black;
	margin : 4px 0 0 658px;
}

Merci d'avance pour vos réponses !

Je me demande si ça ne pourrait pas être un problème de fusion de marges : http://www.alsacreations.com/article/lire/629-fusion-des-marges.html

Sinon tu as bien mis ton doctype html ? Il m'est arrivé d'avoir des problèmes de marges totalement inexplicables sur une page jusqu'à ce que je m'aperçoive que j'avais oublié le doctype ^^;
Modifié par BlueScreenJunky (05 Aug 2012 - 22:19)

Il est vrai qu'oublier d'intégrer le doctype correctement est un problème que j'avais déjà connu et cela m'a résolu bien des choses...Sinon pour IE, pourquoi ne pas mettre une feuille css spécifique ?

<!--[if lte IE 9]><link rel="stylesheet" href="styles/index-ie.css" type="text/css" media="screen"><![endif]-->
Modifié par greenlife59 (07 Aug 2012 - 14:43)

J'ai finalement réussi à résoudre le problème en créant un deuxième wrapper, dans le wrapper !