Let's flex!

お手本と同じになるようにcssを組み合わせよう!

ここまでできた君ならできる！

Q1: 右下にカードを並べよう

ヒント:justify-content と align-items を組み合わせよう

Q2: 真ん中に均等な間隔で配置しよう

ヒント:align-itemsとjustify-contentを使ってみよう

Q3: 縦並びで上下中央揃えにしてみよう

使い勝手が良いflex!これが使いこなせたら完璧だ！

ヒント: justify-content と align-itemsにflex-direction: column;を組み合わせよう

Q4: 折り返して中央揃えにしてみよう

ヒント：flex-wrap: wrap; と justify-content: center;

Q5: 複数行を上下左右中央に集めてみよう

ヒント:align-content と justify-content

Q6:二重構造を使いこなそう

ヒント:flexの対象は「一つ内側のdiv」
落ち着いてやれば大丈夫！