サイドバーが下に表示されるデザインテーマ(Material)のサイドバーを横に表示する方法
私はデザインテーマにMaterialを使ってます。このデザインテーマはサイドバーが下に表示されるタイプとなっています。
Material - テーマ ストア - はてなブログ
サイドバーを横に表示する方法を調べてたらはまったのでメモしておきます。
元にするブログテーマによっては、サイドバーのfloatをrightに指定するだけではダメなんですね。。
/*サイドバー幅*/ #box2 { float: right; width: 250px; }
2カラムにしてサイドバーを横に表示
横に表示する方法が中々見つからなかったんで、諦めて違うブログテーマにしようとテーマストアを見はじめました。
テーマ ストア - はてなブログ
何気なくテーマストアから自分の使っているMaterialのリンクを見てみると、「2カラムにする方法」があった!
あとは中身をコピペしたら2カラムになって、期待通りサイドバーが横に表示されました。
webgaku.hateblo.jp
おまけ
ついでに見出しの表示だけ変えておきました。
.entry-content h1, .entry-content h2, .entry-content h3 { font-weight: bold; margin: 1em 0 0.5em 0; padding: 3px 10px; border-left: solid 5px #454545; text-shadow: 1px 1px 1px #fff; }
最後に
希望のデザインが見つからない場合は、自分の選択したデザインテーマのリンクを見てみるのも良いかもしれませんね。
気が向いたら、また書きます。