ミスミスターのWebページ作りの途中でflexboxに触れるタイミングがあったので備忘録としてまとめようと思い記事にしました。Flexboxとは、要素のサイズが不明なものでもダイナミックに変化するものでも柔軟なレイアウトを実現できるCSS3の新しいレイアウトモジュールである。複雑なレイアウトでも今までより少ないコードで、よりシンプルなプロセスで実装することができる。flexboxレイアウトを使うには、HTMLの親要素のdisplayプロパティに「flex」を指定する。「flex-direction」プロパティは、flexコンテナの主軸の方向を設定することにより、flexアイテムがflexコンテナでどのように配置されるか明示する。方向は2種類で、横列の水平、縦列の垂直に配置できる。Flexboxの各プロパティがまとまっているシートです。一度こういうものがあるんだと目を通しておくのも大事かと思うので、ぜひ。