最終更新日

flex-flowプロパティ

flex-flowは、flex-directionflex-wrapの値を、まとめて指定するためのショートハンドプロパティです。値は、1~2個指定でき、半角スペースで区切って、好きな順番で並べます。

CSS3での変更点
・flex-flowは、CSS3から新しく追加されたプロパティです。
初期値 適用先 継承
各プロパティの初期値 display: flex;」か「display: inline-flex;」が指定された要素 なし
説明
flex-directionの値 フレキシブルボックス内のボックスの配置方法を指定します。
flex-wrapの値 フレキシブルボックスをマルチラインにします。
サンプルコード
flex-flow: row wrap;
flex-flow: column wrap;
flex-flow: row wrap-reverse;
flex-flow: column wrap-reverse;
参考文献:CSS Flexible Box Layout Module外部リンク
HOME