Właściwość CSS flex-wrap

Definicja stylu, przeznaczenie i użycie flex-wrap

Właściwość flex-wrap definiuje, czy elementy elastyczne powinny być zawijane, czy nie.

Uwaga: Jeśli element nie jest elementem elastycznym, właściwość flex-wrap nie działa.

Wartości właściwości flex-wrap

Składnia CSS flex-wrap

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

Wsparcie przeglądarek dla właściwości flex-wrap

Liczba w tabeli określa pierwszą wersję przeglądarki w pełni obsługującą tę właściwość.

Liczba przed -webkit- i -moz- określa pierwszą wersję, która działała z prefiksem.

Właściwość
flex-wrap	29.0 21.0 -webkit-	11.0	28.0 18.0 -moz-	9.0 6.1 -webkit-	17.0

Przykładowe zastosowania z właściwością flex-wrap

#main {
  width:150px;
  height:150px;
  border:1px solid black;
  display:flex;
  flex-wrap: nowrap;
}

Przykłady właściwości flex-wrap

Przykład 1: w razie potrzeby zawija elastyczne elementy: div { display: flex; flex-wrap: wrap; }