[Resolu]Pb de decalage des sous menus sur menu deroulant

Bonsoir,
J'ai un "drôle" de problème avec des sous menus sur menus déroulant.
Je viens d'y passer quelques heures...et j'avoues ne plus rien y voir
Voici la css:

/*menu horizontal*/
#menu {
	position: absolute;
	top: 85px;
	left: 10px;
	width: auto;
	z-index: 100;
	background: none;
}


#menu ul {
	display: none;
	border-bottom: 1px solid #96b200;
	background: #dae483;
}

#menu li {
	float: left;
	border-left: 1px solid #b1c800;
	border-right: 1px solid #b1c800;
	list-style-type: none;
}

#menu li:hover {
	border-left: 1px solid #96b200;
	border-right: 1px solid #96b200;
}

#menu li a {
	display: block;
	width: 75px;
	color: #fff;
	font-size: 1em;
	padding: 5px;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
	background: url(imag/fd-menu.gif) repeat;
}

#menu li a:hover {
	background: url(images/fd-menu.gif) repeat-x;
}

#menu li a.selected {
	color: #dae483;
}

#menu li a.selected:hover {
	background: none;
}

#menu li a.ssmenu:hover, #menu li:hover a.ssmenu {
	
	background: #b1c800;
}

#menu li:hover ul {
	display: block;
}

#menu li li {
	float: none;
	border: 0;
}

#menu li li:hover {
	border: 0;
}

#menu li li a {
	display: block;
	width: 75px;
	font-size: 0.9em;
	padding: 5px;
	border-top: 1px solid #c5d640;
	text-align: center;
	text-decoration: none;
	color: #336666;
}

#menu li li a:hover {
	background: #dae483;
	color: #fff;
}


	/*fin menu droit*/

et voici lexhtml:

<!--menu deroulant horizontal-->
			
			<ul id="menu">
			
			<li><a href="#">Accueil</a></li>
			
			<li><a href="#" class="ssmenu">News</a>
				<ul>
					<li><a href="#">News1</a></li>
					<li><a href="#">News2</a></li>	
				</ul>
			<li><a href="#" class="ssmenu">Actualités</a>
				<ul>
					<li><a href="#">Actu1</a></li>
					<li><a href="#">Actu2</a></li>
				</ul>
			<li><a href="#" class="ssmenu">Reseaux</a>
				<ul>
					<li><a href="#">Reseaux1</a></li>
					<li><a href="#">Reseaux2</a></li>
				</ul>
			<li><a href="#" class="ssmenu">Regions</a>
				<ul>
					<li><a href="#">Region1</a></li>
					<li><a href="#">Region2</a></li>
				</ul>
			<li><a href="#" class="ssmenu">Themes</a>
				<ul>
					<li><a href="#">Theme1</a></li>
					<li><a href="#">Theme2</a></li>
					<li><a href="#">Theme3</a></li>
					<li><a href="#">Theme4</a></li>
					<li><a href="#">Theme5</a></li>
				</ul>
			<li><a href="#" class="ssmenu">La presse</a>
				<ul>
					<li><a href="#">Presse Nationale</a></li>
					<li><a href="#">Presse Regionale</a></li>
					<li><a href="#">Presse Internationale</a></li>
				</ul>
				
				
				</li>
				
				
			</ul><!--fin menu horizontal-->

En fait, les sous menus se décalent de 20px sur la droite, sans que je puisse voir d'où viennent ces 20px.
Le résultat (provisoire) est visible ici: http://www.he-prod.info/cric/index.php#[/url]
Alors je sais, pour notre ami IE6, pas de menus déroulant: mais je prepare une CSS dédiée IE6 + JS pour notre ami, en parallèle....et, oui, je sais, l'imbrication de balise ul dans des ul avec balises <a> n'st pas appréciée.
Voilà. Donc si quelqu'un de moins fatigué ( ) que moi voit ce qui ne va pas, je suis preneur de tout avis, conseils, etc.
Merci et peut être à bientôt

Salut !

Pour IE cela vient du fait qu'il ne gère pas la pseudo-classe :hover sur les li (IE ne gère cette propriété que sur <a>)

Pour ton souci de marge, mets les toutes à margin:0;padding:0; et avance petit à petit.
tu verras ton erreur plus facilement.

De plus, les sous ul doivent être en absolue, sinon ton menu déroulante va tout pousser.
Modifié par Zeke (02 May 2007 - 08:53)

Un grand merci à toi Zeke; effectivement les ul n'étant pas en absolute, c'est cela qui désorganisait tout le menu, les déroulants poussant le tout... Un grand merci à toi...me reste plus que quelques soucis mineurs à régler; je m'empresse de marquer Résolu avant de me faire tirer les oreilles!
Modifié par boro64 (03 May 2007 - 13:56)

boro64 a écrit :
je m'empresse de marquer Résolu avant de me faire tirer les oreilles!

Est-ce que tu peux marquer... ah non c'est bon