さくらブログのスマホ用htmlをいじりたかった話の続きです。
レスポンシブ化
レスポンシブ化するにあたって、参考にしたサイトはこちらです。
思ったよりも作業量が少なくて、特に問題なくレスポンシブ化が完了しました。
ただ、私の場合はこれで終わりというわけではなく、記事が横にはみ出す感じになってました。
中央揃えとかいろいろ調べて、頑張ってcssをいじってみたのですが
どうしてもブログ記事を中央に持ってくることが出来ず、今は仕方なくマージンで調整しています。
一応私のスマホからは問題なく見ることが出来たので、とりあえずOKということにしました。
このあとはスマホで見た時のためにbackgroundイメージを用意したり
サイドメニューの文字を中央揃えにしたり、マージンを調整したりしました。
あと、何気に苦労したのが検索ボックスを中央に寄せることでした。
コンテンツ→検索ボックスのhtmlの中にcssで書いてあるとこがあって
そこにtext-align : center;を書いてあげたら中央に来てくれました。
ちゃんとスマホで確認を
PCでもブラウザの幅を狭めれば、スマホで見ているのとだいたい同じにはなりますが
微妙に違う点もあります。やはり、スマホで確認することが大事だと思いました、