0

<li>各要素の背景がグラデーションになっている順序付きリストがあります。IE8/9 をサポートするには (IE8+ と Chrome のみをサポートする必要があります)、-ms-filter を使用します (以下のコード スニペットを参照)。Chrome ではすべて問題なく表示されますが、IE8 ではリスト番号が表示されません。ただし、CSS から -ms-filter を削除すると、すべてが完全に表示されます (もちろん、グラデーションは表示されません)。これが私のコードです:

HTML:

<ol id="myList">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
</ol>

CSS:

#myList li {
    background-color: #def;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#EDF3FF', EndColorStr='#CCEEFF')";
    background-image: -ms-linear-gradient(top, #EDF3FF 0%, #CCEEFF 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #EDF3FF), color-stop(1, #CCEEFF));
    background-image: -webkit-linear-gradient(top, #EDF3FF 0%, #CCEEFF 100%);
    background-image: linear-gradient(to bottom, #EDF3FF 0%, #CCEEFF 100%);
    padding: 3px 0px;
    width: 130px;
    margin: 3px;
}

これが機能しない理由についてのアイデアはありますか? 可能な修正はありますか?(IE8のグラデーションを削除する以外に)

4

0 に答える 0