2007年04月04日
MovableTypeのテンプレートを改造してみた
MovableTypeのテンプレートを改造してみた。今までのテンプレートは@スタイルの無料の3カラム、リキッドレイアウトのものを使用していた。導入当初は多少カスタマイズして、文字の色等をいじっただけだったけど、今回レイアウトを変更。エントリを左に。メニューを右側2列にしてみました。
情けない話なのですが、今まではbox(container)のセンタリングは
text-align: center;
で行っていた。
これだとFireFoxだとセンタリングされてくれない。正しくは
margin-left : auto ;margin-right : auto ;
でやるそうです。なんでもIEのバグで、本来はセンタリングされることが間違いだそうです。
ボックスレイアウトを調べて、あれこれやてくうちになんとか形になり、バックグラウンド画像も作って合わせこんだのですが、何故か解像度が違うPCで見るとレイアウトが多少ずれ込んでまいました。
メニューとの境界の縦ラインを出来ればbodyのbackgroundに描いてしまいたかったのですが(メインとメニューのボックスの縦の長さの違いを気にしなくてもよくなる為)解像度の違うPCで見るとずれてしまう。全てpxで設定してあるのに。しばらく調査が必要になりそうです。
text-align: center;
で行っていた。
これだとFireFoxだとセンタリングされてくれない。正しくは
margin-left : auto ;margin-right : auto ;
でやるそうです。なんでもIEのバグで、本来はセンタリングされることが間違いだそうです。
ボックスレイアウトを調べて、あれこれやてくうちになんとか形になり、バックグラウンド画像も作って合わせこんだのですが、何故か解像度が違うPCで見るとレイアウトが多少ずれ込んでまいました。
メニューとの境界の縦ラインを出来ればbodyのbackgroundに描いてしまいたかったのですが(メインとメニューのボックスの縦の長さの違いを気にしなくてもよくなる為)解像度の違うPCで見るとずれてしまう。全てpxで設定してあるのに。しばらく調査が必要になりそうです。
Posted by ぷれお at 00:30│Comments(0)
│MovableType
※このブログではブログの持ち主が承認した後、コメントが反映される設定です。