Промежутки между элементами

Вернёмся к карточкам пород. Они стоят в строке, но касаются друг друга. Можно было бы разделить их отступами, как мы сделали со ссылками в панели навигации (у каждой из них margin-left: 1rem). Но отступ добавляет место с одной стороны каждого элемента, поэтому мы получили бы пустое место и перед первым элементом или после последнего, где оно обычно не нужно.

Для этого у flex-контейнера есть инструмент получше: свойство gap. Оно задаёт размер промежутков между элементами — и только между ними, но не по краям контейнера:

.container {
	display: flex;
	gap: 2rem;
}

Как и для отступов, можно использовать любые знакомые вам единицы, например px или rem.