#72日目　TechAcademy「はじめての副業コース」

提出したい最終課題

スマホ版はおおよそできたので、PerfectPixelを使って、デザインカンプと私の作ったものを重ね合わせて厳密に一致させていきます。

「なんとなく同じっぽい」と思っていた表示が重ね合わせてみると結構違っています。

上から順に確認をしていきます。

主にはmarginとpaddingで調整です。

そして、困ったのが「カルーセルの下に表示される丸（ドット）の位置調整」です。

このドットは、jQueryで表示させているのでHTMLに私はコーディングしていません。

どうすれば良いのか？？？

しかで、デベロッパーツールを使って見てみると「HTMLにドットについてのコードがあり、クラス属性も付与されています」

そこで、CSSにこのクラス名を指定して、位置調整(left:0;)を書いてみましたが動きません。

色々やってダメだったので、メンター先生に質問しました。

基本的に私がやっている方法で、調整ができるとのお返事でした。

という事で試しにright: 2rem;と入力したら、ドットが左に動きました！

leftで動かなかったのは名一杯すでに左に設置されていたからなのでしょうか？

そして、left:-2rem;とマイナスをつけて設定してみると、左に動きright: 2rem;と同じ設置位置になりました。

では、widthを80％とか狭くしてからleft:0; とすれば良いのではないか？と思って実行しましたが、width:80%や20remなど指定しても幅は変わりませんでした。

なぜでしょうか？
これはよくわかりませんでした・・・