はてなブログに使われている、HTML5のCSSを流用し、とにかくシンプルに作ってみました。
このテンプレートはレスポンシブWebデザイン対応で、デスクトップでは左側コンテンツ、右側サイドバーの段組みレイアウトです。
- サイドバー #sidebar
- 要素幅:スマホ・タブレット縦向きはデバイス幅、1024px以上は300px
- コンテンツ #page_content
- 要素幅:スマホ・タブレット縦向きはデバイス幅、1024px以上は660px、1124px 以上は 730px
このように、段組みレイアウトのCSSスタイル名ははてなブログとは違いますよ。全体を.container クラススタイルで括ってセンタリングしてます。ページの背景色を薄い灰色に設定し、.containerクラススタイルの背景色を白にしてみました。
もちろん、レスポンシブWebデザインでっせ。
あんまし複雑にするとカスタマイズが難しいから、Simple is the best ですよね?
ついでに、左サイドバーの右コンテンツパターンも作っちゃいました。
なお、ヘッダーと横並びリンクはセンタリングにしました。
早く wanichan.net のサブドメインを作成してサイト開設しないと、やるやる詐欺になっちゃいますよね。
とりあえず、メインサイトで公開しちゃいます?? そっちの方が早いかも。