1

以下は適用された CSS で、この問題が発生しました。

 background-color: rgba(91, 94, 85, 0.5) !important;
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7F5B5E55,endColorstr=#7F5B5E55);
filter:ms-linear-gradient(startColorstr=#7F5B5E55,endColorstr=#7F5B5E55); /*fix for round corner edges in IE9 and input mess rendering in all IE */

画像 1 : FF、Chrome & IE 9 は正常に動作しています

画像 2 : IE8 ではうまくいきません

IE8 でこの入力を適切に修正する方法がわかりません。フィルターfilter:ms-linear-gradient のせいで、IE8 の背景色を適用してこのフィルターを削除すると、下の画像のように入力がめちゃくちゃになると思います。

このフィルター入力が IE8 の背景色で適切にレンダリングされている場合、期待どおりに適用されません

入力を適切に表示するFirefox

IE8入力bgが台無しになっています

ありがとう 、

ニティッシュ

4

1 に答える 1

7

コードの問題：

  • background-color: rgba(91, 94, 85, 0.5) !important;
    この行は問題ないようです。!importantただし、フラグが冗長である可能性が非常に高くなります。
  • filter:progid:DXImageTransform.Microsoft.gradient( ... );
    -ms-filter: "...";IE8 +では構文が推奨されますが 、この行も問題ありません。

  • filter:ms-linear-gradient(startColorstr=#7F5B5E55,endColorstr=#7F5B5E55);
    ここから問題が始まります。

    1. Internet Explorerのベンダープレフィックスは-ms-、（先頭にハイフンが付いています）です。
    2. -ms-linear-gradientはの値でbackgroundあり、ではありませんfilter。
      また、この値はIE10以降でのみサポートされています...
  • //fix for round corner edges in IE9 CSSのコメントは次の形式です：/* comment */。
    例外なし。

修理：

background-color: rgba(91, 94, 85, 0.5) !important;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7F5B5E55,endColorstr=#7F5B5E55);
-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#7F5B5E55,endColorstr=#7F5B5E55)";
于 2012-04-12T14:44:14.570 に答える