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


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

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

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

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

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

回答の条件
  • 1人1回まで
  • 登録:
  • 終了:2015/02/04 21:06:12
※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。

ベストアンサー

id:a-kuma3 No.1

回答回数4974ベストアンサー獲得回数2154

ポイント100pt

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 の幅だけ広げれば良いというわけにはいかないと思いますが、その辺りを調べて広げていくような感じになります。

id:doyaling

ありがとうございます!!
うまくいきました。

2015/02/04 21:06:00

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません