本文・サイドバーの幅を変更

戻る

新早稲田応化会HPのスタイルはこのテーマ(Twenty Twelve)では下図の様になっています。

style1

つまり、

  • ページ全体: 960px
  • コンテンツ領域(記事の部分):625px
  • ウィジェット領域(サイドバー):250px
  • 中間余白(中間の余白):85px

これですとウィジェット領域が大きくてコンテンツが狭くなります。応化会のページは本文の方が第一義ですからコンテンツ領域を広げたい。下記くらいにしたいですね。

  • コンテンツ領域(記事の部分):700px
  • ウィジェット領域(サイドバー):180px
  • 中間余白(中間の余白):80px

スタイルシートで変更できます。

スタイルシートの変更

スタイルシートはpxで指定するのでなく比率で指定します。
コンテンツの幅の比率は  700÷960×100=72.91667(%)
ウィジェットの幅(サイドバーの幅)の比率は   180÷960×100=18.75(%)

スタイルシート style.css を下記のように変更しました。

style2

今のホームページはこの比率になっています。

戻る