知識、知恵のカタマリ

[PR]コレがGoogleの検索ストーリー

解決済

clip!clip!
Ads By Google

wikiのデザインカスタマイズで本文のところの幅を広くする方法。

livedoorwikiのデザインはliquid_pearlの2カラムなんです。そのときにサイドバー(広告のところ)のスペースが空くので、そこに本文の幅を広くして右側の余白をなくしたいのです。いろいろいじってみましが、わからなかったので質問しました。

図解
-------------------------------
| |
| ウィキのタイトル部分 |
| |
-------------------------------
|編集・新規作成などのバー   |
-------------------------------
| |        |   |
| プ |        | 現 |
| ラ |   現    | 広 |
| グ |        | 告 |
| |   本    |   |
| イ |        | 新 |
| ン |   文    | 本 |
| |        | 文 |
-------------------------------

見にくいですがこんなかんじです。
よろしくお願いします

2006-03-31 00:15の質問
デザイン    カスタマイズ  する    ウィキ      wiki  
デザイン
デザイン の情報はこちらです
www.span.ne.jp
この質問と回答を読んで役に立った場合は「役に立つ質問」に投票してください。投票が多い質問は、役に立つ質問一覧に掲載され、より多くの人に見てもらうことができます。

回答(2)

2.

2006-03-31 03:55:46ベスト
liquid_pearlを選んだ上で,カスタマイズで2カラムに変更したということですよね。

CSSでの名前は,右側のエリアが #right,
左側+中央のエリアが #wrapper,
でその #wrapper がさらに左側の #left と中央部分の #wikibodytop,#wikibody,#wikibodybottom, #.ad に分かれている,という構造は blog と似てるのかな。

2カラムにすると右側がなくなるので,まず
#right{
		width:180px;
		float:right;
		padding-bottom:30px;
}
という部分を
#right{ display:none;}
に変更します。

また,中央の部分を広げるために
#wrapper{margin-right:185px;}

#wrapper{margin-right:5px;}
に変更します。

これでサイズはOKなんですが,背景の画像が固定幅で作られてしまっているので,これを隠すために
#wikibodytop, #wikibody, #wikibodybottom のところにある
background:url(http://image0X.wiki.livedoor.jp/img/... 
を,すべて
background: #fff;
にかえてしまいます。

あと,見た目の微調整として
.ad{text-align:center;margin:0 auto;}

.ad{text-align:right;margin:0 auto;backgrond:#fff;}
に,

#wikibodybottom の
padding:0 15px 20px;

padding:0 15px 100px;
ぐらいにしておけばまあまあになるんじゃないでしょうか。


↑ここにもあとで書き込んでみます。

ちょっと難しいようですががんばってやってみます

1.

2006-03-31 02:22:45
wikiのデザイン一覧にliquid_pearlの2カラムデザインを見つけることができなかったのですが、お書きになっている図を見ますと、3カラムのような気がします。どちらなのでしょうか、お教えいただければ、と思います。

3カラムの広告の下のスペースが空いているので、そこに本文を回りこませるということでしょうか。それだと技術的には困難みたいです。

もし本文の部分が広い方がよろしければ、他の2カラムデザインに変えられることをお勧めしたいと思います。
Ads By Google

コメント(2)

#1.  nuko
2006-03-31 02:24:52

現在は2カラムです。2カラムだと空きスペースができるのでそこに本文を拡張させて余白をなくしたいと思っています。

他デザインの検討もしてみます

2006-03-31 02:37:45

お役に立てず、すみません。wikiのCSSを拝見しましたが、ブログの倍は難しいですね。あちこちに各ブラウザ用の修正がたくさん入っていました。全てのブラウザを持ってないと完全な修正は無理みたいです。

ちょっと力不足を感じました。すみません。

トラックバック(2)

トラックバックURL: