Bonjour à tous,

Je suis actuellement en train de refaire le code d'un site sur lequel je travaille.
La home page possède un menu horizontal de 9 éléments qui était auparavant une simple successions de :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
<a href="blablabla">
     <img src="blablab"/>
</a>
Pour y apporter plus de stabilité, j'ai voulu tout mettre dans une liste horizontale :

Code : 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
<ul style="list-style-type: none;">
  <li style="display: inline; padding: 0; margin: 0;">
     <a href="blablabla">
     <img src="blablab"/>
     </a>
  </li>
 
  <li style="display: inline; padding: 0; margin: 0;">
     <a href="blablabla">
     <img src="blablab"/>
     </a>
  </li>
 
  .....9 fois....
    <li style="display: inline; padding: 0; margin: 0;">
     <a href="blablabla">
     <img src="blablab"/>
     </a>
  </li>
</ul>
Seulement, un petit espace entre les <li> subsiste encore et toujours.
J'ai tout essayé (même les trucs les plus farfelus. Sait-on jamais...) : margin :0; margin: 0px; margin-left:0px; margin-right:0px.

Cela est non seulement très moche, mais en plus le 9e élément de ma liste se retrouve sur la ligne suivante !

Si quelqu'un pouvait me dire où je me trompe ou ce que j'oublie pour avoir des éléments de liste bien collés les uns aux autres, ce serait très sympa.

Merci d'avance !