Je n'arrive pas à aligner mes <span> incorporés dans des <li> et à gérer leurs tailles en même temps. Le "display:block;" me permet de gérer la taille mais pas l'alignement et inversement avec un "display:inline;"

Voici mon code html :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
<ul id="Onglets">
          <li><span class="Onglet">Cabinet</span></li>
          <li><span class="Onglet">Valeurs</span></li> 
          <li><span class="Onglet">SavoirFaire</span></li>
          <li><span class="Onglet">Trouver</span></li>
          <li><span class="Onglet">EspacePro</span></li>
</ul>
Et le Css correspondant :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
.Onglet{
   background-color: white;
  border: 1px solid black;
  /*display:block;  */
  width: 20%;
}
 
#Onglets{
  list-style-type:none; 
  border: 1px solid green; 
  display: inline;
  /*width: 100%;*/
}
Merci d'avance.

Cordialement.

Tristan.