見出し画像

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

提出したい最終課題

引き続きPerfectPixelを用いて、微調整していきます。

HTMLでクラス名を共通にしていたものをCSSで修正すると、すべてが変わってしまうため、なかなか注意が必要です。

上から順に修正していきますが、1か所どうしても表示されない部分がでてしまい、paddingやmarginを追記・修正してみますが全く表示されません。

色々試しましたがダメでしたので、メンター先生に質問です!

⇒すると、JavaScript(jQuery)で追記する必要があることを教えてくれました。

ここはjQueryの「タブ」機能を使っていたのですが、デフォルトでは「高さが自動設定される」になっているのでそれを無効化する「autoAdjustHeight: false」を追記する必要があるとの事です。

これは私がいくら調べてもわからない事です。

もっと早く質問すれば良かった・・

コーディングしてみるとうまく表示されました😊

そして、marginを上から調節していきましたが、最後がむしろmarginが下にはみ出てしまいました。

ですので、margin-bottomを小さくして調整しようとしましたが、そうすると上の部分がはみ出る(margin-topが大きすぎる)ことになりました。

そこでnth-child、last-childを使う事を思いつき、実行してみました。

しかし、作動しません。

何回かトライしてうまくいかなかったので、再びメンター先生に質問しました。

すると: (コロン)の数が一つになっていました。

私は二つのコロンを書いていたので、それを一つにして実行してみると、きちんと作動しました。

でも、コロンは一つでも二つでもどちらでも良かった気もするのですが・・

本日はここで終了しました。

この記事が気に入ったらサポートをしてみませんか?