IE8バグ？：a要素内に画像があってa要素に背景を指定した時に位置がずれる

キャプチャ見てもらうと分かるようにIE8だけ極端に位置がおかしい。 IE8がリリースされてから、まだあんまりいじってないのでよく分かってないのですが、今組んでいるサイトをIE8でチェックしたら、「あれ？表示がおかしい...」って事に遭遇してしまったので、エントリー。 よくある感じで、リストのマーカー変わりに背景の指定をa要素にして、そのリスト内には画像テキストが入ってたんです。はい。 毎度のようにサンプルも用意してみました。 サンプルを見る 発生条件は調べた感じa要素内にimg要素があって、a要素にbackgroundプロパティの指定をした時に起こる感じです。 img要素にテキストが隣接してても同様でした。 サンプルみたいなデザインの場合、マーカー部分も一緒に切ってしまう事が多いから過去の案件は大丈夫だと思うけど・・・ 取りあえず、今回のサンプルに使ったソースは以下です。 <ul> <li

[akotetu]

display: inline-block;の指定で解決？

[uduca]

a要素によくあるアイコン背景画像がIE８だとだいぶずれるらしく、その回避方法。

[vanish_l2]

IE8かぁ・・・ヤバソーだ・・・

[Layzie]

おおうふ。

[ysk_lucky-star]

高さが決め打ちなら a 要素に line-height プロパティに高さ分を与えちゃえばいんでない？

[boyasan]

inline-blockで工夫

[nanto_vi]

IE 8で、自身または子孫要素にvertical-align: top;が指定され、かつ同一行に自身のline-heightより高い要素を持つインライン要素の背景画像の位置の基準点がずれることがある。http://tinyurl.com/dxw747 か。

[kkeisuke]

inline-block

[hiro_y]

リストのa要素の中にimg要素があって背景が指定されてる場合のレイアウト崩れ。IE8/Safari 3。

[shouchida]

似たようなのに遭遇した。