2012-04-09 10 views
1

CMS内で少しのインラインCSSを扱っています(楽しい!)。このコードはChromeとFirefoxの両方で動作しますが、バックグラウンド画像は一度だけ発生します。しかし、IE 9でページが読み込まれるときは、no-repeatの値が無視され、背景イメージがdivの長さにわたって繰り返されるようになります。IEでCSS「no-repeat」が機能しない

<div style="width: 500px; margin-top: -10px; background-image: url(http://.../uploadedImages/horizontal-rule-top.gif); background-position: 50% 0%; background-repeat: no-repeat, no-repeat; "><p style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; color: rgb(228, 128, 28); padding-top: 30px; padding-bottom: 15px; font-size: 16px; "> 
...</div> 

ご了承ください。

答えて

5

私はIEが第2のno-repeatの存在に問題を抱えていると思っていますし、仕様によっては理解できないルールを無視しています。 IEが理解オプションがあるように見える:

  • repeat-x
  • repeat-y、および
  • no-repeat

上記のいずれかにCSSを修正した場合は、動作するはずです。

+0

[IE9は複数の背景をサポートしています](http://caniuse.com/#feat=multibackgrounds)と思われますが、実装上の問題があるかもしれません。 – BoltClock

+0

ええ、私は多分、バックグラウンドでの実装に問題があるかもしれないことに気付いたときにあなたの答えを投票しました。 –

0

background-repeat: no-repeat;を2番目の値なしで試してください。私は、2つの値の構文がCSS3 working draftの一部であり、IE9で実装されていないと考えています。

0

バックグラウンド:url(http://.../uploadedImages/horizo​​ntal-rule-top.gif)no-repeat 50%0%; "

0

PROVA CON:

背景リピート-X:なしリピート; background-repeat:repeat-y;

関連する問題