人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

はてなブログのデザインCSSに関する質問です。

http://blog.hatena.ne.jp/doyaling/
このブログなのですが、本文の表示領域を広くしたいと思っています。
CSSの中に、

/* メニュー部分と本文部分の幅を調節 */

#main {
width: 680px; /* ← 620px */
}
#box2 {
width: 260px; /* ← 320px */
}

という部分がありますが、これは本文部分はデフォルトで620pxだったのを680にし、サイドバー部分は320だったのを260にしているという意味です。
単純にmainのところのwithを大きくすると、サイドバーが押し出されるような形になって、本文の下(つまりページのものすごく下の方)に来てしまいます。本文とサイドバーの幅の合計を制限するような何かが入っているのだと思いますが、それをどうやれば変えられるのかがわかりません・・・。

どなたかアドバイスお願いします。

●質問者: doyaling
●カテゴリ:ウェブ制作
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● a-kuma3
●100ポイント ベストアンサー

CSS のセレクタで、#main は、id="main" という要素(タグ)を指すのですが、id="main" や id="box2" を囲むように、id="content" という DIV タグがありまして、これが width: 960px に指定されています。

http://blog.hatena.ne.jp/-/blog_style/12921228815722328540/47f170bdc7d484bb9ab156d44534701c7a9842c6
これが、テーマのスタイルを決めている外部 CSS の URL ですが、この 526行目に、その #content の幅の指定があります。

#content {
 width: 960px; /* これ! */
 margin-left: auto;
 margin-right: auto;
 display: block;
 *zoom: 1;
}

#content の幅が決まっているので、#main の幅だけを大きくしていくと、#box2 が横に入りきらなくなって、下の方に押し出されます。
他にもヘッダの部分とか幅を決めているところが何か所かあるので、#content の幅だけ広げれば良いというわけにはいかないと思いますが、その辺りを調べて広げていくような感じになります。


doyalingさんのコメント
ありがとうございます!! うまくいきました。
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ