[resolu] Decalage 1pixel sur IE6 uniquement (ok sur IE7 et FF)

Bonjour,

J'ai un problème de décalage de pixel sous IE6, alors que çà fonctionne impeccablement sur IE7 et FF. Et quand j'arrive à le faire fonctionner sur IE6, çà ne marche plus sur FF.

le problème intervient à deux endroits, comme indiqué sur l'image.
http://www.lerepairedesmotards.com/img/tmp/tmp2.jpg

sur le site en live

le code html :

<div id="nav_main_background">
<div id="top">
	<div id="nav_subscribe">
				<a href="/forum/login.php?f=0">S'identifier</a> &nbsp; | <a href="/forum/charte.php?msg=Inscription">&nbsp; S'inscrire</a>

    	</div> 
    <div id="nav_main">
 	 <ul>												
   		 <li><a href="/actualites/index.php">ACTUALITES</a></li> 	 						
		 <li><a href="/essais/index.php">ESSAIS</a></li>
		 <li><a href="/guides/index.php">GUIDES</a></li>
		 <li><a href="/services/index.php">SERVICES</a></li>
    	 <li><a href="/forum/index.php">FORUMS</a></li>

         <li>&nbsp;</li>
 	 </ul>
    </div>
</div>
</div>

CSS :

#top {
	width:984px;
	height:43px;
	background:url(/img/layout/bk-logotop2.jpg) left no-repeat;
	margin:auto;
}	

#nav_main_background {
	background:url(/img/layout/header-top-side.jpg) repeat-x;
}

#nav_main {
	float:right;
	height: 43px;
	margin-right: 5px;
	font-size: 12px;
	font-weight:bold;
	text-decoration: none;
	text-align:center;
}	

#nav_main li {
	float:left;
	width:auto;
	height:43px;
	margin-top: 2px;
	line-height:43px;
	display:list-item;
	list-style-type:none;
	background:url(/img/layout/puce.jpg) no-repeat left center;
}

#nav_main a{
	padding:0 13px 0 13px;
	display:block;
	color:#FFFFFF;
}

#nav_main a:hover{
	background: url(/img/layout/tab.png) no-repeat bottom center;
	color:#FFCC00;
}

#logo img {
background-image:none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/img/layout/header2.png");
}

A priori, le problème sur le premier pixel doit avoir la même origine que pour le logo, donc je ne mets pas le code html lié au logo pour simplifier.

merci des idées ou directions dans lesquelles chercher...
Modifié par ElMotard (13 Aug 2009 - 15:53)

je peux certes rajouter un commentaire conditionnel réservé à IE mais j'aimerai éviter...

des idées ou pistes ?

merci

Salut,

Un background-position-y à top plutôt que center semble résoudre ton problème.

Merci Agylus ! çà marche... et du coup, çà entrainait un décalage de 2 pixels (au lieu de 1) avec un espace entre la bande du haut et le logo, mais uniquement sur IE6.

la seule solution que j'ai trouvée :
margin: 2px 0 -2px 0;
dans #nav_main li
et çà a l'air de fonctionner partout.