CSS flex-wrap

flex-wrapプロパティ

フレックスアイテムの折り返しを指定する
折り返す場合の方向も指定できる！

値の指定方法

• nowrap
  フレックスアイテムを折り返さない
  デフォルト値
• wrap
  フレックスアイテムを折り返す
  次の行に折り返す
• wrap-reverse
  フレックスアイテムを折り返す
  前の行に折り返す

⚠️
nowrapを指定すると折り返さずにはみ出す設定ではあるが、
flex-shrinkというプロパティがデフォルトで効いているため、
はみ出さずに子要素が縮小してしまう！
わざとはみ出させたい場合には、flex-shrinkの設定も必要になる！
⚠️

flex-wrapの使い方

flex-wrapは商品一覧のような、
決まった大きさの要素を並べる際に使う。
子要素が親要素の幅（flex-directionがcolumnの場合には高さ）を
はみ出る時の並べ方を指定できます。

---

演習問題をやってみて、解答を見たときに
こんなやり方もあるんだ！となった時の方が頭に残るね
いろんな人のコードを見るのが重要ってこういうことかと実感🤔