Ads By Google
2カラムから3カラムになりません。
現在「Blueline」のブログを使っていて、2カラムから3カラムに変えたいのですが
#container
#blogcontainer
#wrapper
#content
#left
#right
をCSSに書き加えても、2カラムのままで更に
崩れてしまいます。
「Blue Line」を3カラム化する方法を教えて欲しいです。お願いします。
2006-09-14 23:33の質問
この質問と回答を読んで役に立った場合は「役に立つ質問」に投票してください。投票が多い質問は、役に立つ質問一覧に掲載され、より多くの人に見てもらうことができます。
回答(1)
1.
2006-09-15 21:35:43

[デザインの設定]-[カスタマイズ]で「トップページ」などに、<div id="blogcontainer"> の下に<div id="wrapper">などの記述はありますか?
なければ追加しなくてはなりません。
既にカスタマイズされていたら、もう一度「Blueline」を選択してから以下のように変更してみてください。
1.HTMLの変更
トップページ、個別記事ページ、カテゴリアーカイブ、月別アーカイブを以下のように変更します。
1)<div id="blogcontainer"> と<div id="content">の間に
2)<div id="links"> を
3)<$PluginList_A$>の後に
2.CSSの変更
1)「#links」を「#left」に変更
2)「#content」の「width:540px;」を「width:350px;」に変更し、「float:left;」を「float:right;」に変更
3)「#left」の「float:right;」を「float:left;」に変更
4)以下を追加
なお、#wrapperと#contentの幅を広げる場合には、#banner,#subbannerの背景画像を、画像処理ソフトなどを使って横幅を広げる必要があります。
なければ追加しなくてはなりません。
既にカスタマイズされていたら、もう一度「Blueline」を選択してから以下のように変更してみてください。
1.HTMLの変更
トップページ、個別記事ページ、カテゴリアーカイブ、月別アーカイブを以下のように変更します。
1)<div id="blogcontainer"> と<div id="content">の間に
<div id="wrapper">を追加する。
2)<div id="links"> を
<div id="left">に変更する。
3)<$PluginList_A$>の後に
</div></div></div> <div id="right"> <div id="linkstop"></div> <div id="linksbody">を追加する。
2.CSSの変更
1)「#links」を「#left」に変更
2)「#content」の「width:540px;」を「width:350px;」に変更し、「float:left;」を「float:right;」に変更
3)「#left」の「float:right;」を「float:left;」に変更
4)以下を追加
#right{
width:190px;
float:right;
}
#wrapper{
float:left;
width: 540px;
}
なお、#wrapperと#contentの幅を広げる場合には、#banner,#subbannerの背景画像を、画像処理ソフトなどを使って横幅を広げる必要があります。
分かりやすい回答、ありがようございます。
思ったとおりに変更できました。
Ads By Google
コメント(2)
#1. 藤谷 望
2006-09-15 00:32:23
ちなみに過去ログはご覧になりましたか?
http://knowledge.livedoor.com/1108
が参考になりそうな気がします。
また、「Blue Line」というデザインテンプレートはどのカテゴリにあるのでしょうか…?
探してみたのですが見つからず…。
出来ればブログのURLを教えて頂けると助かります。
#2. yozu
2006-09-15 02:01:42
コメントありがとうございます。
正しくは「Blueline」で、コレです↓
http://blog.livedoor.com/design_demo/simple_line_b...
その過去ログは見て、一応変更入れてみたのですが
3カラムにならず苦戦してます。



