[resolu]Leger soucis avec menu accordeon

bonsoir a tous
j ai trouve un super menu accordeon mais que je desire utiliser a deux endroits differents sur ma page web
j ai donc creer deux feuilles de style differentes et ajouter 2 a la fin de chaque classe
mais les effets ne fonctionne pas pour ce deuxieme menu
qui peux m expliquer pourquoi
merci de l aide
1 er code

.navigation {
  margin: 0;
  padding: 0;
  list-style: none;
  background: #FFF;
  color: #FFF;
  width: 700px;
  font: 1.2em "Trebuchet MS", sans-serif;
}
.navigation a, .navigation span {
  display: block;
  padding: 4px 10px;
  color: #000000;
  text-decoration: none;
  background: #F7DFFF url(menu-item.png) left bottom no-repeat;
}
.navigation .toggleSubMenu a, .navigation .toggleSubMenu span {
  background-image: url(menu-item-deroule.png);
}
.navigation .open a, .navigation .open span {
  background: #3E78FD;;
}
.navigation a:hover {
  text-decoration: underline;
}
 .navigation a:focus{
  text-decoration: underline;
}
.navigation a:active {
   background: #3E78FD;
}
.navigation .subMenu {
  font-size: .8em;
  background: #ccc url(subMenu.png) 0 0 repeat-x;
  font-size: .9em;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid #666;
}
.navigation ul.subMenu a {
  background: none;
  padding: 3px 20px;
}

2 eme code

.navigation 2 {
  margin: 0;
  padding: 0;
  list-style: none;
  background: #FFF;
  color: #FFF;
  width: 250px;
  font: 1.2em "Trebuchet MS", sans-serif;
}
.navigation a 2, .navigation span 2 {
  display: block;
  padding: 4px 10px;
  color: #000000;
  text-decoration: none;
  background: #F7DFFF url(menu-item.png) left bottom no-repeat;
}
.navigation2 .toggleSubMenu a 2, .navigation .toggleSubMenu span 2 {
  background-image: url(menu-item-deroule.png);
}
.navigation .open a 2, .navigation .open span 2 {
  background-image: url(menu-item-enroule.png);
}
.navigation a:hover 2, .navigation a:focus 2, .navigation a:active 2 {
  text-decoration: underline;
}
.navigation .subMenu 2 {
  font-size: .8em;
  background: #ccc url(subMenu.png) 0 0 repeat-x;
  font-size: .9em;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid #666;
}
.navigation ul.subMenu a 2 {
  background: none;
  padding: 3px 20px;
}

Modifié par flexi2202 (23 Jun 2013 - 22:56)

Bonjour,

Tu dois enlever les espaces en les noms de tes éléments et le 2.

.navigation2 {
  margin: 0;
  
.
.
.

bonsoir
merci c est resolu