livedoor ナレッジ

ブログの右側と左側に余計な空白ができます。

ここをみていただければ分かるとおり、右側と左側に不自然な空間があいています。
デザインをかえて（3カラムのもの）全て再構築したりしたのですが、結果は同じでした。
これで普通なのでしょうか？
できればこの余計な空白を何とかしたいのですが・・・

後、3カラムのデザインに変更して再構築しても右側と左側のアーカイブや最新のコメント、QRコードなどがずれてしまいます。

どうすればきちんと表示できるでしょうか？

（先程の回答の続きです。）
このデザインは、背景画像自体が短く、白い部分があるものなので、これを作り替えます。
説明用に作ってみました。そのまま使う場合は、ダウンロードして、自分のブログのところにアップロードし直してください。

先程のところから少しスクロールすると、

	#container{
		width:800px;
		background:url(～) repeat-y 50% 0;
		padding:0;
		margin:0 auto;
		text-align:center;
		word-break:break-all;
	}

というところがあります。

　　background:url(～) repeat-y 50% 0;

　　の行は実際には、( ) の中に

　　http://image.blog.livedoor.com/img/usr/t_butterfly/bg.gif

　　と入っています。
　　ここに表示させるのは長いので、「～」にしました。

background:url(～) repeat-y 50% 0;

の ( ) の中を

http://image.blog.livedoor.jp/horsefly/imgs/7/d/7dbee850.gif

に変更してください。

background:url(http://image.blog.livedoor.jp/horsefly/
imgs/7/d/7dbee850.gif) repeat-y 50% 0;

となります。
＊　長いので二行になっていますが、実際に入力する時は、くっつけて、一行にしてください。

［この内容で保存する］をクリックしたら、
ページの右上のほうにある「ブログに設定を反映（再構築）」をクリックして
「ブログに設定を反映（再構築）」ページに進みます。
プルダウンフォームを［デザイン（CSS）］に合わせ、［ブログを再構築する］をクリックしたら、取りあえず、終了です。

ブログを開き直して確認してください。
一応、これで良いと思ったら、
http://image.blog.livedoor.jp/horsefly/imgs/7/d/7d...
をクリックして出てくる線のような画像を、PCにダウンロードしてください。
これを自分のブログに、サムネール作成のチェックをせずに、アップロードして、画像のURLをコピーします。
そのURLを使って、この回答（前の回答の分は必要ありません）の始めから、もう一度実行してください。
今度は、

http://image.blog.livedoor.jp/horsefly/imgs/7/d/7dbee850.gif

が、先程コピーした、自分のブログの画像のURLになります。


うまく行かない場合は、コメントに書いてください。
解決できましたら、質問を、解決済みにしておいてください。
http://knowledge.livedoor.com/5517
をご参考に

不自然な空間が空いている、と言うのは逆に言えば、「ブログ本体の横幅が狭い」と言えると思います。

ブログの本文の幅を広げたりされてみてはいかがでしょうか。
下記参考にされてみて下さい。
http://knowledge.livedoor.com/5358
http://knowledge.livedoor.com/2766
http://knowledge.livedoor.com/5639

画像の拡大が必要な場合は、こちらを使って画像を拡大できます。
http://www8.plala.or.jp/kusutaku/iview/
ダウンロードして、解凍して、起動。
画像　→　リサイズ/リサンプル　→　（アスペクト比を保存にチェックを入れたまま）新しい大きさを指定

3カラムにするとずれるのは、記事に使っている画像が大きいためと思われます。
記事の内容が、本文カラムで設定されている大きさ以上になると、サイドバーが落ちます。
↓参考にされて下さい。
http://wiki.livedoor.jp/everydaydesign/d/%A5%B5%A5...

これも、本文のカラムを広げるのが対策になるかもしれません。

まず、このデザインを改善したいのでしょうか？
このデザインではない、3カラムのデザインにしたいのでしょうか？

実際に使われるのは、どちらか一方ですから、一つはムダになります。
ムダにされると分っていて答えるのは、気持ちが良いものではありません。

今、使われているデザインに関するものだけ、お答えします。
状況が変わった場合は、別に質問してください。

このデザインは、livedoor Blogの仕様に、上のバーがなかった頃に作られたものだと思います。
それで、バーの幅とデザインの幅が合わない分、白い場所ができてしまっています。

この問題は、ブログ本文の幅を広げても、解消しません。
そうしたいのなら、デザインも触らないと、無理です。

今回は、取りあえず、この白い部分をなくすことだけをしてみましょう。
その結果の表示が、利用者の好みかどうかは、わたしにはわかりません。

ブログの管理や投稿編集のページの横の下のほうに「注目のデザイン」というのがあると思います。
そこの（デザインを変更する）をクリックして、「デザインの設定」のページへ行きます。
一番下の右側に「カスタマイズ」というのがあります。
そこをクリックして、スタイルシートやHTMLを編集できるページへ行きます。
スタイルシートが表示されていますから、そこで作業をするなり、これをコピーして、メモ帳等で書き換えることになります。

最初のほうに、

	body{
		margin:0 auto;
		padding:0;
		text-align:center;
		font-family: verdana ,arial ,sans-serif;
		background:#fff;
		color:#000;
	}

という部分があります。

background:#fff;

の行を次のように書き換えます。

background:#979d61;

全体としては、

	body{
		margin:0 auto;
		padding:0;
		text-align:center;
		font-family: verdana ,arial ,sans-serif;
		background:#979d61;
		color:#000;
	}

となります。

もう一ヶ所、変えます。
これは、字数制限と、その後の作業の説明の関係で、次の回答に書きます。
続けて読んでください。