html - マウス ホバー時に IE8/9 でグラデーション背景の点滅を回避する方法

Question

次の CSS を IE8/9 に適用し、空の領域にマウスを合わせると、背景が点滅します。

ここにHTMLがあります

<div style="width: 100%;">
    <ul>
        <li>
            <a class="content" href="javascript:;">
                Please mouse over after the words
            </a>
        </li>
        <li>
            <a class="content" href="javascript:;">
                Please mouse over after the words
            </a>
        </li>
    </ul>
</div>

CSSの設定はこちら

ul {
    list-style: none; margin: 0px; padding: 0px; border: 0px; position: relative;
}
li {
    padding: 0px; position: relative;
    cursor: pointer;
}
.content {
    padding: 3px 6px;
    border-radius: 4px;
    text-decoration: none;
    display: block;
}
.content:hover {
    margin: 0;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e3f4fd', endColorstr='#c7e9f9',GradientType=0 );
}

jsfiddleで例を実行できます