はてなブログ初心者｜ブログ幅の変更が上手く行かない〜左余白が空いてしまう場合の対処法
公式テーマの「Epic」を使用させて頂いています。
ブログ幅を広くしたいと思い、
#containerと#wrapperと#box2のwidthを変更したら、以下のように左側に余白ができてしまいました。
上記画像のCSS↓
ここから展開
#wrapper { width: 720px; float: left; }
#container { text-align: center; margin: 20px auto; width: 960px; padding: 0 0 30px; background: #fff; }
#box2 { width: 180px; float: left; -moz-transition: all 1s ease; -webkit-transition: all 1s ease; text-align: left; }
左余白をなくしたいと思い、このCSSに#mainのwidthを変更したものを追加してみました。
上記画像のCSS↓
ここから展開
#wrapper { width: 720px; float: left; }
#container { text-align: center; margin: 20px auto; width: 960px; padding: 0 0 30px; background: #fff; }
#box2 { width: 180px; float: left; -moz-transition: all 1s ease; -webkit-transition: all 1s ease; text-align: left; }
#main { float: right; width: 560px; padding: 0 30px; min-height: 100px; }
うまくいきました。
#mainは検証画面の右上から探しました。
このテーマは#wrapperの中に#main（記事）と日付ゾーンがありました。
この場合、#wrapperだけ変えたらおかしなことになるのかもしれません。
この変更につまづいたので、忘備録として残しました。
