28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je fais un menu css à 3 niveaux
les deux premiers niveaux doivent être horizontaux
le troisième vertical.

tout ce passe bien dans IE7 mais dans IE6 j'ai un espacement entre les LI que je ne comprend pas.
Lors du passage de la souris dans cette espacement, le sous menu disparait étant donné que je ne me trouve plus dans l'élément LI.

Comment puis je enlever cette espacement?

voici mon code CSS:



#menu
{
	
    width: 600px;   
    list-style: none;

}

#menu li
{
	/*affichage horizontal*/
	float: left;
	list-style: none;
	

}

#menu a
{
	
	display: block;
	background-color:Yellow;

}


/*une fonction javascript permet de modifier l'élément LI au passage de la souris pour simuler le hover*/
#menu li:hover,
#menu li.IEMhover
{
	background-color:Aqua;
}

/*permet de cacher le deuxieme niveau*/
#menu li ul
{
	visibility: hidden;
	position:absolute;
	margin-left: 0px !important;
	padding-left: 0px;

}

/*permet d'afficher le deuxieme niveau*/
#menu li:hover ul,
#menu li.IEMhover ul
{
	/*display: block;*/
	visibility: visible;
}

/*3e niveau affiché en vertical*/
#menu li ul li ul li
{
	float: none;
	
}

/*permet de cacher le 3ieme niveau*/
#menu li:hover ul ul,
#menu li.IEMhover ul ul
{
	visibility: hidden;
}

/*permet d'afficher le troisieme niveau*/
#menu li:hover li:hover ul,
#menu li.IEMhover li.IEMhover ul
{
	visibility:visible;
	
	
}



Merci
Modifié par catamenia21 (19 Dec 2008 - 14:32)