提出したい最終課題

PerfectPixelを使って、ヘッダーからデザインカンプとの差を修正していきます。

PerfectPixelは自分がコーディングしたものを表示している上に、デザインカンプを重ね合わせて、ズレを見るとても便利なchromeの拡張機能です。

そして、chromeのデベロッパーツールを使用し、幅をパソコン用の指定サイズ1536pxに設定し、重ねていきます。

しかし、まずこのデベロッパーツールでの表示自体がズレる事があります。

今までの学習中にもこのような事があり、初めは私は気付かずにmarginなどを設定し直していましたが、ズレたwebサイトを作った事になっていました。

これはどうもchromeの問題ぽいのですが、幸い「コーディングしたサイト vs デザインカンプ」の二つの間でズレることは無い事がわかりました。

ですので、あまり気にせずにPerfectPixelを使って、デザインカンプとの差異を修正していきます。

Marginとpaddingで調整できるものは良いのですが、position: absoluteやrelativeをしたりするコーディングはまだ使いこなせません。

margin設定をしてもまったく動かなかったりすることも多く、苦戦します。

でも、ある程度一致すれば次に進んで、最後にまた戻ってこようと思います。

今日はあまり進みませんでした・・