Как сделать список горизонтальным css

Для того что бы расположить список (<ul>/<ol>) элементов в линию можно применить один из ниже приведенных способов.

<ul>
  <li>123</li>
  <li>456</li>
  <li>789</li>
  <li>1011</li>
  <li>1213</li>
</ul>

Вариант №1

Изменить свойство display у тега <li> на inline. Тем самым изменить способ показа элемента в документе с блочного на строчный, после этого <li>-теги станут в ряд, и контент внутри них будет занимать столько места, сколько требуется для отображения

ul li {
  display: inline;
}

Вариант №2

Использовать flexbox. Аналогично предыдущему примеру изменить свойство display на flex, в родительском контейнере тегов li - в данном случае в <ul>, после чего они встанут в ряд.

ul {
  display: flex;
}