Flexbox の寸法とラインの組み合わせを試します

これまで、「CSS Flexible Box Layout Module（W3C Candidate Recommendation, 18 September 2012）」に基づく検証サンプルをいくつか作成してきていますが、今回は、寸法とラインの組み合わせをいくつか CSS Flexible Box Layout Module 検証サンプルページ（６） にて確認してみました。

具体的には、flex コンテナにおける flex-wrap プロパティ（nowrap と wrap）と、flex アイテムにおける flex プロパティ（none、auto、initial）の組み合わせです。

わたしが確認に利用したブラウザは Chrome 27 で、表示イメージは、Chrome 27 のスクリーンショットです。

なお、Firefox 22 でも確認しました。その表示の違いは明らかなのですが、例えば、flex プロパティ が auto の場合に Firefox 22 での表示が次のスクリーンショットのようになることについて、結果として十分期待されるものであるようにも思います。

flexbox を使いはじめてから、どうなるのか気になっていた点でしたが、やや波乱含みというような感じも当初ありましたので、これまであまり深く突っ込まないでいました。

今回はちょっとだけ試してみたかったことの確認でした。