IE8以下でCSSで背景を指定したのに全く表示されない時にチェックしておきたいポイント

Web制作Tips

ie-point

CSSで下記のような背景を指定するケースって多いと思います。

background: url(../images/common/arrow.png)left center no-repeat;

でもこれだと背景画像が表示されないんですよ!(IEの解釈では。)

正しくは下記の通りです。

background: url(../images/common/arrow.png) left center no-repeat;

どこが違うかわかります?

実はleftの前に半角スペースが入っているかいないかです。

モダンブラウザでは問題なく表示されるので結構見落としがちですが、半角スペースが入っていないとIE8以下では表示されなくなります。

環境によってはIE9でも表示されない場合もあるようです。

背景画像が表示されないぞ!って時はこういったポイントをチェックしてみると修正できると思います。

コメント

タイトルとURLをコピーしました