За что отвечает Flex-Wrap

Свойство flex-wrap определяет, будут ли flex-элементы переноситься на новую строку (или столбец) при нехватке места в контейнере.

Значения:

• nowrap (по умолчанию) — элементы остаются в одной строке, сжимаясь или растягиваясь.
• wrap — переносит элементы на новую строку при нехватке места.
• wrap-reverse — аналогично wrap, но переносит в обратном порядке.

Пример:

.container {
  display: flex;
  flex-wrap: wrap; /* или nowrap/wrap-reverse */
}

Применение:
Полезно для адаптивных макетов, когда нужно избежать переполнения контейнера. Например, карточки товаров в ряду будут автоматически переноситься на новую строку при уменьшении экрана.