По умолчанию пункты списка располагаются как блочные элементы, т. е. каждый новый пункт размещается на новой строке. Однако на странице вполне может оказаться контент, по сути являющийся списком, который вам хотелось бы отобразить иным образом. Хорошим примером может послужить набор навигационных ссылок. Можно ли разместить их горизонтально?

Решение
Для горизонтального размещения пунктов списка нужно присвоить свойству display для элемента li значение inline, например:

HTML:
<ul class="horiz">
<li><a href="#">Главная</a></li>
<li><a href="#">Новости</a></li>
<li><a href="#">Форум</a></li>
<li><a href="#">Галерея</a></li>
<li><a href="#">О нас</a></li>
</ul>

CSS:
ul.horiz li {
display: inline;
}

Результат применения данного правила стиля изображен на рис. 2.28.

Рис. 2.28. Горизонтальное расположение пунктов списка