ラリーのリザルトなど、右に長い表を掲載するので、2カラム、左メニュー、右コンテンツで可変長のスタイルが使いたい。
しかし、標準のテンプレートはすべて、そしてフリーのテンプレートもほとんど固定長センターレイアウトのものだ。
そして、やっと見つけたよさそうなテンプレートは、まだMovableType4に対応していない。
Vicuna - Movable Type テンプレート
しばらくCSSなどいじっていなかったので、あまり気が向かなかったが、オリジナルのテンプレートを作成することにした。正確にはほとんどスタイル(CSS)の作成だ。
余談だが、本来の意味ではMovableTypeのテンプレートは、HTMLとCSSを作成するものであり、配色、フォントやレイアウトを変更するのはスタイル(テーマ)の仕事だと思う。
しかし、一般世間では、この2つ、ほぼごっちゃに使われてるね。
もちろん、2つの役割は明確に切り分けできないんだけど、「テンプレート配布」サイトでも、結局標準テンプレートに適用するスタイルを配っているだけだったりすることも多いので、ちょっと紛らわしい。
閑話休題。
そんなわけでテンプレートを自作することになったが、段組なんてもうほとんど忘れている。そこで、参考になったのがこのサイト。
スタイルシートによる崩れない 2カラム 3カラム・レイアウト
ソースとその例をいくつも挙げて、メリット、デメリットを解説している。
なお、このサイトにあるWEB SAFE COLOR ウェブ・セーフ・カラーは、文字色と背景色を検討するときにとても便利そうだった。
これを参考に、MovableType4標準のminimalist-redスタイルに対して変更をかけていく形で、作成。
ただ、minimalist-redはfloatを使っているのに対して、僕がやりたいのはposition:absoluteを使った段組。
floatを扱うブラウザのバグがを処理する気にはなれなかったからだが、position:absoluteでは、フッターカラムが中央右(メニュー)カラムの高さしか把握できずに、中央左カラムが長い場合に、重なってしまうという、バグに悩まされる。これについては、上のサイトが詳しい。
結局、フッターが、メニュー部分にかかっても良いようなレイアウトを考えて、お茶を濁した解決した。
