Bonjour,
J'ai un petit problème d'affichage et j'ai donc du mal a comprendre pourquoi?

Dans mon css j'ai ceci:
Code CSS : Sélectionner tout - Visualiser dans une fenêtre à part
li.active a {color:#ff2222}

Et mon code est ceci
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
 
<ul>
  <li class="level1"> <a href="#" title="Accueil" >Accueil</a> </li>
  <li class="level1 active"> <a href="#" title="Chambres" >Chambres</a>
    <ul class="sub-menu">
      <li class="level2 active"> <a href="#" title="2 personnes" >2 personnes (1-4 et 14a)</a> </li>
      <li class="level2"> <a href="#" title="2-3 personnes" >2-3 personnes (11-12)</a> </li>
      <li class="level2"> <a href="#" title="4 personnes" >4 personnes (5 et 8 et 14b)</a> </li>
      <li class="last level2"> <a href="#" title="3 à 9 personnes" >3 à 9 personnes</a> </li>
    </ul>
  </li>
</ul>

Ce que je ne comprend, ce quand je clique sur "2 personnes", je devrais avoir "Chambre" et "2 personne" en rouge. Alors dans mon cas j'ai tout en rouge.

En fait, puisque "Chambre" à la classe active
Code CSS : Sélectionner tout - Visualiser dans une fenêtre à part
<li class="level1 active">
Tous les <a> hérite du rouge, ce que je ne veux, et ce que je ne sais pas maitriser.

Pourvez-vous m'orienter