Свойство flex-wrap в CSS

определение и использование

свойство flex-wrap определяет, должно ли эластичное свойство переходить на новую строку.

Примечание:свойство flex недействительно, если элемент не является эластичным элементом.

Руководство по CSS:свойство flex

Руководство по CSS:свойство flex-basis

Руководство по CSS:свойство flex-direction

Руководство по CSS:свойство flex-flow

Руководство по CSS:свойство flex-grow

Руководство по CSS:свойство flex-shrink

Руководство по HTML DOM:свойство flexWrap

позволяет эластичным элементам переходить на новую строку, если это необходимо:

div {
  display: flex;   
  flex-wrap: wrap;
}

flex-wrap: nowrap|wrap|wrap-reverse|initial|inherit;

значение	описание
nowrap	по умолчанию. Определяет, что эластичные элементы не должны переходить на новую строку.
wrap	определяет, что эластичные элементы должны переходить на новую строку, если это необходимо.
wrap-reverse	определяет, что эластичные элементы должны переходить на новую строку, если это необходимо, в обратном направлении.
initial	установить это свойство в его значение по умолчанию. См. также initial.
inherit	инерция. Преемственность этого свойства от родительского элемента. См. также inherit.

по умолчанию:	nowrap
наследование:	нет
создание анимации:	не поддерживается. См. также:связанные с анимацией свойства.
Версия:	CSS3
JavaScript синтаксис:	object.style.flexWrap="nowrap"

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

Числа с префиксами -webkit- или -moz- представляют собой первую версию, использующую префикс.

Chrome	IE / Edge	Firefox	Safari	Opera
29.0 21.0 -webkit-	11.0	28.0 18.0 -moz-	9.0 6.1 -webkit-	17.0