Выравнивание по главной оси

Теперь разложим панель навигации в верхней части страницы. Мы хотим, чтобы логотип был слева, а ссылки справа — такую раскладку вы найдёте на большинстве сайтов.

У панели навигации (элемента nav с классом navigation) два дочерних элемента: логотип и div с классом links, в котором лежат три ссылки. Когда мы сделаем панель навигации flex-контейнером, эти два элемента станут его flex-элементами.

То, как элементы распределяются вдоль главной оси, задаёт свойство justify-content flex-контейнера. Вот его значения на примере трёх элементов в строке:

Место, которое элементы не занимают, называется свободным пространством. При space-between всё оно достаётся промежуткам между элементами — это как раз то, что нужно нашей панели навигации.