2005年11月19日

[CSS]IEとFirefoxでの差分 気付きメモ

最近、やたらめったらとblogのCSSをいじってみてて、それで気付いたIEFirefoxの差分をメモ。

1.margin、paddingの差
普通にやっただけだと気付きにくいんですが、background-colorとか指定していると差が出る。
IEの方がpadding域までレンダリングしている様子。

2.text-alignの差
divタグに使用した場合、Firefoxだとちゃんとテキストのみに反映されます。
IEだと中の要素まで属性がついちゃいます。

3.font-sizeの差
やはりdivタグに使用した場合に差がでます。
Firefoxの場合、中のタグにも反映されます。
IEだと中のタグには反映されません。

4.floatの差
divタグなんかにfloatを指定してサイドバーなんか作りますが、その時に他の要素の回りこみを制御した場合に差が出ます。
Firefoxだとalignを指定すると頑張って回り込みしてくれます(笑
IEだとすぐヘなってくれるのでちょと助かる。
なので、float指定した場合はFirefoxで確認した方が良さそうですよ。

5.レンダリング性能に差がある
floatを使ってレイアウトしてた場合などで、新たに追加した要素がwidthやらheightやらの指定よりオーバーするのはFirefoxが先なのか、それとも回り込みの頑張り具合の差なのか詳しく検証していませんが、Firefoxの方が崩れやすいです。
IEで確認していると気付かない場合が多いです。
やはりFirefox中心に確認した方が安全なようです。

割と見つかるものだと思いましたが、どっちが正しいとかまでは調べていません。
ま、どのみちFirefox1.5でもIEと差があることは分かったので、まだまだ複数のブラウザでデザイン確認しないといけないのは確かです。

ついで
づっとOperaを使わずにきました。
理由はCSS使ったページがきちんと表示されないという情報を聞いていたのと広告が表示されるからだったんですが、広告表示を止めたので使ってみました。
流石にバージョンが上がってきただけあってCSSも割ときちんと表示されるようですね。
でも、Google検索窓が予定よりも長く表示されてます・・・なんでだろう・・・
いじってたらそのうち分かるかもなので、その時にでもメモしよう。
posted by ケイ at 19:38| Comment(0) | TrackBack(0) | プログラム | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント:

この記事へのトラックバックURL
http://blog.seesaa.jp/tb/9540627
※ブログオーナーが承認したトラックバックのみ表示されます。
※言及リンクのないトラックバックは受信されません。

この記事へのトラックバック
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。