未経験独学が初めて模写コーディングに挑んでみた②

こんにちは。
本日は昨日に続き、昨日模写したサイトのレスポンシブ対応をしていきたいと思います。

はて、最初から何をして良いのかわからずでしたが、
とりあえずアイコン画像が左寄せになってるのでこれを中央寄せにしたい。
だがしかし、なかなかうまくいかない、、、
Google先生に聞いてなんとかできました。

これが

こうなりました！

mainのwidthを100％にし、
要素のclassにmargin:0 autoを使用しました。

@media (max-width:600px) {
    main {
        width: 100%;
    }
    .flex {
        margin: 0 auto;
    }
}

これにて一旦サイト模写は終了です。

次回はレベルアップしたウェブサイト模写にチャレンジします！
Jsの勉強も進めつつ、もう少ししたら自分のオリジナルウェブサイトも作成したい所存です！

30歳独学未経験でどこまでいけるのか楽しみです。

ではでは。