sukima5
サイトの幅を変更したら、今度はその隙間の幅が気になった。

なので、ここも変更することにした。

隙間の幅の変更の仕方

1、「外観」⇒「テーマの編集」⇒「base.css」

ダッシュボードの左のカテゴリーから
「外観」⇒「テーマの編集」をクリック。

右のカテゴリーから「base.css」をクリック。

「テンプレートレイアウト」ところを見つける。

2、2カラムレイアウトという場所を見つける。

/*——————————————————–
テンプレートレイアウト
——————————————————–*/

このサイトのレイアウトは、「2カラム 右バー」

なので、ここから少し下がり、「 /*2カラムレイアウト*/ 」という場所を見つける。
sukima2

float: right;
width: 30%;

狭い方が「right」右だ。

これは、
ブログ幅100%に対して、
メインコンテンツ(記事部分)が60%
サブコンテンツ(サイド部分)が30%
の割合だ、と書いている。

ブログで確認すると…
sukima32

この隙間が、結局残りの10%といえるわけだ。

メインコンテンツ(記事部分)が60%
+
サブコンテンツ(サイド部分)が30%
+
隙間10%

サイト幅 100%

だから、この10%を、好きな数値に減らせばいい。

自分的には、メインを広げて、隙間をかなり狭くしたいので…

3、メインコンテンツ(記事部分)を68%に変更

 

sukima1

 

ここで気をつけるのは、合計が100%以上にならないようにすること。
たぶん、バランスがおかしくなってしまうはずだ。

4、下の方にある「ファイルを更新する」をクリック。

 

計算上
メインコンテンツ…68%
+
サブコンテンツ…30%
+
隙間…2%

サイト幅 100%

で、ブログは、こんな感じ。

sukima41


私は、これで、なんとか自分では、見やすくなった、と思っている。

ちなみにサイトのカラムは、右の2カラムのほか

その下に

/*2カラムレイアウト(リバース)*/ 左の2カラムもある。

変更する際には、自分のサイトのサイドバーがどちらにあるか、気をつけて欲しい。

ブログ全体の幅を変えたい人は⇒賢威7.0 コーポレート版のブログ幅を変える方法