tanatiyo ヘッダーの上部を固定してから、レスポンシブが崩れた件で、前回は原因探しを行っていました。
一つ一つ、コンテンツやモジュールなどを確認していくと、それぞれに原因があることが分かってきました。
原因は一か所ではありませんでした(-_-;)
例えば、表のセルに赤の背景色をつけてみると、右側の余白に飛び出しているのが分かったり、
～1200px,1300px～の範囲では問題がなかったセクションが実はこの間だけ画面右側に余白が出てしまったり・・・
さらに、一つのセクションで同じようにブログカードを配置しているだけなのですが、2枚目～3枚目を表示していると問題はないのに
上にスクロールして1枚目～2枚目を表示させるとなぜか右側の余白が生まれてしまう現象に出くわしたり・・・
デベロッパーツールで一つ一つの要素を検証していったにも関わらず、右側の余白を生んでいる要素はなく、
それでもなぜか画面スクロールバーと右側余白の出現がしてしまう・・・
と、様々でした。
とりあえず、一つ一つ、原因が生まれてはそこに修正をかけていきました。
中には結局、あるセクションだけoverflow：hidden;をかけたところもあります。
全く使わない、ということは難しかったです＞＜
今回、コーディング課題に取り組む時間がかかりすぎていて、自分がどこを触っていたのか、どこからどこまでやっていたのか、という履歴確認が不十分で、作業の精度にムラが生まれてきてしまっていることが浮き彫りになってきました。
今までは単純な静的サイトをサクッと1枚取り掛かる、という感じで短期決戦で終わっていましたが、
動的なサイトが初めてでいろんな実装をするなかで、調べてながら・・・となると、やはり時間もかかってしまいました。
自分が作業に慣れていって、スピードアップをするのはもちろんのこと、しっかりと作業の進捗管理を行えるツールを導入するタイミングなのかも、とも思いました。