Bonjourm,
je me cassse encore la tete avec le formatage de mes li.

J'aimerais que lorsque je passe ma souris sur un li, il n'hérite pas de celui du dessus.

mon menu est aisni:
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
 
<div id="menu" class="alignCenter">
    	<ul id="menuDeroulant">
        	<li class="level1"><a href="#">Accueil</a></li>
            <li class="level1"><a href="#">Principe</a></li>
            <li class="level1"><a href="#">Pourquoi</a></li>
            <li class="level1"><a href="#">Services</a> 
                <ul class="sousMenu">
                	<li class="level2"><a class="level2" href="#">Pack Analyse Personnelle</a></li>
                    <li class="level2"><a href="#">Armoires – Dressing</a></li>
                    <li class="level2"><a href="#">Personal Shopping</a></li>
                    <li class="level2"><a href="#">Bons cadeaux</a></li>
                    <li class="level2"><a href="#">Shopping Thèmes</a>
                    	<ul class="sousMenu2">
                        	<li class="level3"><a href="#">:.. Anniversaires</a></li>
                            <li class="level3"><a href="#">:.. Naissances</a></li>
                            <li class="level3"><a href="#">:.. Saint-Valentin</a></li>
                            <li class="level3"><a href="#">:.. Mariages</a></li>
                            <li class="level3"><a href="#">:.. Autres Occasions</a></li>
                        </ul>
                    </li>
                </ul>
 
            </li>
            <li class="level1"><a href="#">Tarifs</a></li>
            <li class="level1"><a href="#">Partenaires</a></li>
            <li class="level1"><a href="#">Contact</a></li>
       </ul>
    </div>
et mon CSS est ainsi
Code CSS : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
div#menu{
	height:25px;
	position:relative;
	width:643px !important;
}
 
ul#menuDeroulant{
	 width: 644px;
	 list-style-type: none;
	 margin: 0;
	 padding: 0;
	 border: 0;
	 position: absolute;
	 top: 0;
	 left: 0;
}
ul#menuDeroulant li{
	float: left;
 	width: 90px;
 	margin: 0;
 	padding: 0;
 	border: 0;
	text-align:center;
	font-size:10px;
	letter-spacing:0.1em;
}
#menuDeroulant ul.sousMenu{
 	display: none;
 	list-style-type: none;
 	margin: 0;
 	padding: 0;
 	border: 0;
}
#menuDeroulant ul.sousMenu li.level2{
 	float: none;
 	margin: 0;
 	padding: 0px 0px 0px 0px;
 	border: 0;
 	width: 200px;
	text-align:left;
 	border-bottom: 1px solid #eae0cb;
	background: transparent url("../img/fond-menu.png") repeat;
	 	/*border-right: 1px solid #eae0cb;*/
}
#menuDeroulant ul.sousMenu li.level2 ul.sousMenu2 li.level3{font-size:12px; border-bottom: 1px dotted #eae0cb;}
 
#menuDeroulant .sousMenu .sousMenu2 li{
	list-style-type:none;
	background: transparent url("../img/foknd-menu.png") repeat; 
	float: none;
 	margin: 0;
 	padding: 0px 0px 0px 0px;
 	border: 0;
 	width: 200px;
	text-align:left;
 	border-bottom: 1px solid #eae0cb;
}
#menuDeroulant ul.sousMenu2 li.level3 a{
	padding-left:13px; text-transform:lowercase;letter-spacing:1px;
}
 
#menuDeroulant li:hover > .sousMenu { display: block; }
 
#menuDeroulant li a{text-transform:uppercase;padding-left:10px;}
 
#menuDeroulant li a:link, #menuDeroulant li a:visited, #menuDeroulant li a:active
{
 display: block;
 color: #FFF;
 margin: 0;
 line-height:25px;
 text-decoration: none;
}
 
 
#menuDeroulant li.level1 a:hover{ background-color: #6f5wd45; }
li.level2:hover { background-image:none; background-color: #6f5d45; }
li.level3:hover { background-image:none; background-color: #a4845c !important; }
 
#menuDeroulant .sousMenu li a:link,
#menuDeroulant .sousMenu li a:visited,
#menuDeroulant .sousMenu li a:active
{
 display: block;
 color: #FFF;
 margin: 0;
 border: 0;
 text-decoration: none;
}
/*
#menuDeroulant .sousMenu li a:hover
{
	background-image:none;
}
*/
 
/*  EBD MENU */

Aussi c'est mais aussi arrivé que , SOUS IE8, quand je pass la souris sur mon lien, le background-color disparait quand la sous passe entre deux lettres, ou quand le lien est en deux lignes, quand la sous passe entre les deux mots, le backround-color diparait aussi.
Avec vous une idée comment résoudre se deuxieme probleme?

Merci