Comment afficher une liste HTML horizontalement

Publié le 7 Août 2014

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

Rédigé par Bliz

Publié dans #CSS

Repost 0
Commenter cet article