Webサイトをセンター合わせのデザインにする場合、例えば
<div id="container">コンテンツ</div>
のをセンタリングする場合、スタイルシートは
#container {
margin-left: auto;
margin-right: auto;
width: 760px;
}
などとすれば、IE7、Firefox、Operaなどは問題なくセンターリングされますが、IE6ではブラウザのバグによりセンタリングされません。
忘れないようにメモ
スタイルシートで2段カラムや3段カラムのレイアウトをおこなう際、親ボックスの中の子ボックスをfloatしますが、そうすると親ボックスに指定してあるはずの背景画像が表示されなかったりすることがあります。
散々なやんで色々調べた結果、clearfixハックの存在を知り、この問題を解消することができました。
他の部分でも、floatを使うことがありますが、brや空のdivにclearを指定したりしなくて済むので、それ以降なにかと使うことが多くなりました。大変便利なテクニックですね！
Movable Typeを久しぶりにいじったのとver.4を始めて扱ったので慣れるまでに大変でした。
横着してデフォルトをいじってのデザインだったので、スタイルシートでだいぶ苦労しました。人の書いたCSSだとルールを把握するまでに時間がかかるのと、恐らくデフォルトのデザインもベースを改変してのもののようで、スタイルを上書きしているような点が何点もみられた。
全部整理すれば、半分くらいのコードになりそうですが、そこはまた今度ということでなんとか見栄えだけは整えるところで一旦落ち着こうと思っています。
それと、Movable Typeの管理画面、大分扱いやすくなったような気がしますが、テンプレートやCSSを管理画面から編集する際、ソースコードが一部分消失するような場面が何度かありました。
Recent Comments