Annuler effet cascade d'un menu

Salut à tous,

J'aurais besoin de votre aide car je cherche à "réinitialiser" l'effet cascade de ma feuille de style.
En plus claire et en gros :

Au départ j'ai une div :

<div id="main_d">

Dans laquelle j'ai un menu classique :

<ul>
<li>Loulou</li>
<li>Riri</li>
<li>Fifi</li>
</ul>

la css du menu ressemble à ça :

#main_d ul{width:270px;list-style: none;margin:35px 15px 10px 0px;}
#main_d li{background:url(../img/li-droite.png) 0% 50% no-repeat;padding:10px 10px 10px 30px;color:#560039;}
#main_d li:hover{background:url(../img/li-droite-hover.png) 0% 50% no-repeat;color:#fff;}

Jusque là tout va bien mais si je veux créer un second menu (toujours dans main_g), mon nouveau menu conserve tous les attributs du premier, même si je lui donne une id par exemple. Du coup, il faut que je re-précise tous les attributs même ceux dont je n'ai pas besoin dans le second menu mais qui sont présents dans le premier

Si vous avez une idée, merci d'avance de votre aide.
Byebye
Zed1
Modifié par Zed1 (30 Sep 2011 - 11:52)

Salut.

Quand tu commence à avoir des conflits de la sorte, tu n'as pas le choix, tu dois rajouter une classe/id à un niveau plus bas. Ton HTML devient :

<div id="main_d">
	<ul class="un_nom_de_classe_qu_il_est_bien">
		<li>Loulou</li>
		<li>Riri</li>
		<li>Fifi</li>
	</ul>

	<ul class="un_nom_de_classe_qu_il_est_encore_mieux">
		<li>Mickey</li>
		<li>Minnie</li>
		<li>Tout leurs amis</li>
	</ul>
</div>

et ta css

#main_d ul {
	//style communs à tes deux listes
}

.un_nom_de_classe_qu_il_est_bien {
	//style de ta première liste
}

.un_nom_de_classe_qu_il_est_bien li {
	//style des éléments ta première liste
}
.un_nom_de_classe_qu_il_est_encore_mieux {
	//style de ta deuxième liste
}