Comment afficher une liste HTML horizontalement

Après avoir vu comment supprimer les puces d'une liste HTML voici comment afficher une liste horizontalement avec CSS. En combinant cette technique avec quelques styles bien choisis (border, padding, etc) il devient facile de réaliser des menus et onglets.

Donc partons d'une liste toute simple comme la dernière fois:

<ul>
  <li>Pêche</li>
  <li>Pomme</li>
  <li>Poire</li>
</ul>

ce qui donne:

• Pêche
• Pomme
• Poire

Maintenant appliquons le style suivant sur les éléments <li>:

display: inline;

et on obtient:

• Pêche
• Pomme
• Poire