xoops123さあ、いっしょに XOOPS はじめましょう！

　じゃあ、早速、サクッと３カラムにして終わりましょうか？

ええ～っと、中央ブロックの左側だから、そうそう、その前に書けばいいのか～



ということで、左ブロックに関する記述を中央ブロックの前に持ってきました。

楽勝！！！　はい。完了～　　？？？

ブラウザで見てみましょう。



あれっ？　左ブロック部分が上に横一杯に表示されちゃいました。
これは、どうなっているんでしょう？

いえいえ、実は、これでちゃんとテーマファイル内に書かれたとおりの表示なんですよね。
つまり、こんな簡単に３カラムにはならない～～～　っていうことで・・・

すいません。
もうちょっと頑張って作業を進めましょう。

　では、今度は試しに <section> ～ </section> の中に左カラムの記述を移動させてみましょうか？

 

はい。こんな感じになりました。


サクッと作業して保存、ブラウザで見ると・・・



ありゃりゃ？　やっぱり変わりませんね。
でも、どうやらこれはキャッシュが効いているような気がするので・・・altsysの「テンプレートの高度な操作」にて「コンパイル済みテンプレートキャッシュ」を削除してみましょう。

削除が終わったら、ブラウザをリロード



右カラムが上にあがったと思います。でも、３カラムになっていないですよね。

　これはどういうことかと言いますと、style.cssを見ると判ります。（いや、CSSを見ずともテーマ内の記述を見るだけで判る人もいるでしょうけど・・・）
 
sectionに設定されているクラス「left-col」は
width: 70%; float: left;
そして、左ブロックがあるsidebarのクラス「sidebar」は
width: 20%; float: right;
ですから・・・
 
sectionが７０パーセントの幅で左側に、sidebarが２０パーセントの幅で右側に表示され、それぞれの間に１０パーセント幅の空白があるということで、section内にあるdivについては、表示幅指定がないのですから、このような表示にしかならないのですね。
 
ということは・・・section内にある中央ブロックと左ブロックについて、幅の指定と回り込みの指定をしないと、上手く表示してくれないと言うわけで、theme.htmlとtheme_centercolumn.htmlそれぞれの記述を眺めてみると、中央左右のブロック以外はＩＤやクラスが設定されていないので、何らかの対策をしてあげないといけないことが判ると思います。