ul,liをblock指定した時、IE7でズレるのはline-heightだけじゃないっぽい。
またしても覚書。
表題の通り、ulとliのmarginやpaddingを0にしてdisplay:blockにして、liの子要素に画像を使ったナビゲーションを作ったんだけど、IE7だけズレる。IE6とIE8はズレないだけに余計に不可思議。
で、調べてみたところ、こちらでline-heightが悪さをしている、という記事を発見。
http://redline.hippy.jp/lab/css/ie_1.php
これでめでたく解消した部分もあったんだけど、最後までline-heightだけではどうにもならない箇所があった。
結果的には解消したんだけど、top:0pxとしてみたり、background-positionを0にしてみたり、挙句要素そのもの(li)にも背景の画像を入れてみたりと、急ぎでいろいろやったので正直どれが効いたのか未だわからず…
今度似たケースが出てきたら詳しく検証してみたい。
IE対応はほんとに骨が折れますね。
表題の通り、ulとliのmarginやpaddingを0にしてdisplay:blockにして、liの子要素に画像を使ったナビゲーションを作ったんだけど、IE7だけズレる。IE6とIE8はズレないだけに余計に不可思議。
で、調べてみたところ、こちらでline-heightが悪さをしている、という記事を発見。
http://redline.hippy.jp/lab/css/ie_1.php
これでめでたく解消した部分もあったんだけど、最後までline-heightだけではどうにもならない箇所があった。
結果的には解消したんだけど、top:0pxとしてみたり、background-positionを0にしてみたり、挙句要素そのもの(li)にも背景の画像を入れてみたりと、急ぎでいろいろやったので正直どれが効いたのか未だわからず…
今度似たケースが出てきたら詳しく検証してみたい。
IE対応はほんとに骨が折れますね。
コメント