【デザインテーマ】スマホ表示で問題が発生しました

こんにちは!

先日、サブブログを公開しまして、とりあえず完成して良かったです。

しかし、微調整や軽微なデザインの変更はしています。

coooool.hatenablog.com

本日、ちょっと気になる部分を調整し「さて、ホームページを制作するか」と思ったのです。

しかし・・・

ブログデザインする際、Chromeでしたら「右クリック→検証」でHTMLやCSSなどが見られます。

そして、HTMLでどのIDやクラスが割り当てられているか分かります。

IDやクラスをクリックするとCSSが表示されます。

そして、色々と打っていく訳ですね。

たとえば、左揃えの文字(text-align:left)→中央表示(text-align:center)してみるとかですね。

そこで試して問題ないなら、CSSファイルに書き込みます。

地味な作業ですが、まぁ、中々楽しいです。

ま、めちゃくちゃ疲れますが。

で、本日、Chromeの機能でスマホ表示にしたら画面が横にはみ出る現象に遭遇しました。

ヘッダやフッター、そしてコンテンツを一時的に非表示にしても画面が横スクロールされる・・・。

ダメだ・・・。

色々試しましたが、ダメでした。

しかし、何度か読み込みをし直していたら治りました。

あと、それらしいCSSも削除しました。

これで解消(されたはず笑)。

スマホの実機で確認したところ、まったく問題ないので、それで良しとしようかな。

ブログデザインは楽しい

ひたすらCSSを打っていく。

そして、上手くいったときは、「よっしゃー!」という感じです。

それを体験したくてCSSを書いているようなモノ。

CSS上級者ではないけれど、中級者だと思っています。

上級者に足を踏み入れている?

分かりませんが(笑)。

さいごに

ホームページ制作まで中々たどり着きませんが、これから取り組もうかな。

ホームページ制作はSCSSを使います。

CSSよりだいぶ楽なので、効率良く進めば良いな。

ありがとうございました。