日報#29 | flexは直下の子要素にしか効かない！

1.本日の作業内容
⬛︎HTML, CSSを使って簡単なWebサイトのコーディングをした。
・左右中央に揃えるレイアウトを書いた。

2.直面した問題点
＜問題点＞
⬛︎テキスト等を左右中央に揃えるのが難しい。flexを指定したのに、急に効かない部分が出てきた。
・前回、急にflexが効かなくなったと思っていたのが、構造をよく見直したら直下の子要素ではない部分だから効いていなかった。

＜対応＞
→前回はmainで括った部分にflexを書いて、一気に全体にflexを効かせようと思ったけれど、そうすると直下の子要素にしか効かないから、flexが効かない部分がたくさん出てきてしまうし、わかりにくい。
⬛︎全体構造からmainの中でもsectionやarticle等をブロックとして捉えて、そのブロック自体(親要素)にflexを指定するようにした。

3.残っている課題△、進行中の作業⬜︎、明日の予定⬛︎
△flexでできることのイメージができていない。
→横並び、縦並びにはできるようになったけれど、そこ止まり。
⬜︎簡単なwebサイトのコーディング：flexの学習
⬛︎flexについて学習する。
・flexでできることは何か
・どういう時によく使うのか

4.気づき、学び
　webサイトをコーディングするときに、少し前まではとりあえず上から書いていたけれど、最近はブロックを意識して、それぞれのブロックにclass名を指定してcssを書いたり、同じスタイルを指定したいところはまとめてcssを書いたり、なんとなく自分なりの書き方が掴めてきた気がする！まだまだ練習あるのみ！