Hello,

J'ai un petit soucis pour faire dérouler mon sous-sous menu lorsque je passe la souris sur le li niv2 (2018) cela ne marche pas, ul niv3 (maja/hasard) reste caché. La dernière ligne de code du css n'est probablement pas juste?
Merci d'avance Smiley ufo




[code=html]
<div>
<ul id="niv1">
   <li id="niv1"><a href="#">artistes</a>
      <ul id="niv2">
         <li><a href="#">jacques</a></li>
         <li><a href="#">charles</a></li>
         <li><a href="#">aurele</a></li>
      </ul>
    </li>
    <li id="niv1"><a href="#">archives</a>
      <ul id="niv2">
         <li id="niv2"><a href="#">2018</a>
             <ul id="niv3">
               <li id="niv3"><a href="#">maja</a></li>
               <li id="niv3"><a href="#">hasard</a></li>    
            </ul>
        </li>
         <li id="niv2"><a href="#">2017</a>
        <ul></ul>
        </li>
     </ul>
  </li>
</ul>
</div>



#niv1 {
  padding:0;
  margin:0;
  list-style:none;
  text-align: center;
  width: 180px;
}
#niv1 ul {
  padding:0;
  margin:0;
  list-style:none;
  text-align: center;
}
#niv1 li {
   background-color:#729EBF; 
   border-radius: 6px;
   margin-bottom:2px;
   border:solid 1px #333A40
}
#niv1 li li {
   max-height:0;
   overflow: hidden;
   transition: all .5s;
   border-radius:0;
   background: black;
   border: none;
   margin:0
}
#niv1 a {
  display:block;
  text-decoration: none;
  color: white;
  padding: 8px 0;
  font-family: baskerville;
  font-size:1.7em
}
#niv1 li:hover li a {
  font-size:1.4em
}

#niv1 li:hover {
   background: blue
}
#niv1 li li:hover {
   background: purple;
}
#niv1 ul li:last-child {
   border-radius: 0 0 6px 6px;
   border:none;
}
#niv1 li:hover li {
 max-height: 15em
}

ul ul ul {display: none;} ;
niv1 li li:hover ul.niv3 {display:block;};

[/code]
Modérateur
un coup de fatigue ?

quelques erreurs sur les dernieres lignes de code : des points virgule en dehors des cloux qui invalident le selecteur suivant, puis niv1 sans # puis une class .niv3 quand ce serait une #niv3. Quoique, une id ne peut être utilisée qu'une seule fois dans une page autant en faire des class pour que tout fonctionne correctement Smiley cligne
Modifié par gcyrillus (04 Oct 2019 - 17:35)