CSS flex-wrap プロパティ

必要であればフレックスアイテムをラップします：

div {
    display: -webkit-flex; /* Safari */
    -webkit-flex-wrap: wrap; /* Safari 6.1+ */
    display: flex;
    flex-wrap: wrap;
}

定義と用法

flex-wrap プロパティは、フレックスアイテムをラップすべきかどうかを指定します。

注: 要素がフレックスアイテムでない場合、flex-wrap プロパティの効果はありません。

デフォルト値：	nowrap
継承：	継承する
アニメーション可否：	不可。animatable を参照
バージョン：	CSS3
JavaScript 構文：	object.style.flexWrap="nowrap" Try it

表中の数字は、完全にプロパティをサポートした最初のブラウザのバージョンです。

-webkit-、-moz- の後に続く数字は、接頭辞付きで動作した最初のバージョンです。

プロパティ
flex-wrap	29.0 21.0 -webkit-	11.0	28.0 18.0 -moz-	9.0 6.1 -webkit-	17.0

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

値	説明	Play it
nowrap	デフォルト値。フレックスアイテムをラップしないように指定します	Play it ❯
wrap	必要に応じてフレックスアイテムをラップするように指定します	Play it ❯
wrap-reverse	必要に応じてフレックスアイテムを逆順にラップするように指定します	Play it ❯
initial	プロパティにデフォルト値を設定します。initial を参照	Play it ❯
inherit	このプロパティは親要素を継承します。inherit を参照