要素の背景に画像を引いて、リピート表示させてたんですが、なぜかIE6と7だけ中途半端に表示されてしまう現象に遭遇。
いろいろ調べてみたところ、どうやら画像を引くときでもちゃんと背景画像も入れておかないとダメみたい。
これを
1 2 3 4 5 |
#foo { padding: 20px 40px 0 20px; background-image: url(img/form/bg_body.png); background-repeat: repeat-y; } |
こうしたら治りました。
1 2 3 4 5 6 |
#foo { padding: 20px 40px 0 20px; background-color: #b18956; background-image: url(img/form/bg_body.png); background-repeat: repeat-y; } |
ちなみに #b18956はbodyの背景色です。
要素の背景画像に近い色を指定してもいいのかもしれませんが、背景に画像を使いたい場合は、結構特殊なレイアウトなりデザインになってることが多い気がするので(個人的にはそういうパターンが多いです)bodyなり親要素なりの背景色に合わせたほうがいいと思います。
ちなみに background-color:transparent; はダメでした。
コメントする