javascript - IE で削除ボタンが壊れているリスト (LI 要素ではない) スタイル

Question

私は好きなスタイルを持っており、いつものように Firefox 18 では見栄えがしますが、IE 9 のバージョン (完全に最新ではないことはわかっています) ではひどい (そして壊れている) ように見えます。

そこで、このスタイルをあきらめて、オンラインで機能する例を見つけようと決心しました。しかし、IEとの互換性は言うまでもなく、似たようなものを見つけることは不可能だと思います!

ここの誰かが私の例を修正する方法を知っていて、おそらく下位互換性を高める方法を知っていますか、または私がいくつかのポインタを得ることができるこの種のスタイルの例を誰かが知っていますか?

HTML

<div class="DateStyle"><span class="DateStyle_Date">21/01/2013</span><span class="DateStyle_Cross">x</span></div>

<div class="DateStyle"><span class="DateStyle_Date">11/02/2012</span><span class="DateStyle_Cross">x</span></div>

<div class="DateStyle"><span class="DateStyle_Date">08/05/2012</span><span class="DateStyle_Cross">x</span></div>

CSS

.DateStyle {
    display: inline-block;
    background-color: #4A4F54;
    color: #A4A7AA;
    font-weight: bolder;
    -moz-border-radius: 8px;
    border-radius: 8px;
    padding: 2px 6px 2px 8px;
    line-height: 1.2em;
}
.DateStyle_Date {
    padding-right: 5px;
    border-right: #A4A7AA dashed 1px;
}
.DateStyle_Cross{
    padding-left: 4px;
    height: 15px;
}

.DateStyle:hover {
    background-color: #5C6165;
}

JQuery

$(document).ready(function() {
    $('.DateStyle_Cross').hover(function(){
        $(this).parent().css('background','#751919 ');
    }, function(){
        $(this).parent().css('background','#4A4F54');
    })
    $('.DateStyle').hover.css( 'cursor', 'crosshair' );
    $('.DateStyle_Cross').hover.css( 'cursor', 'crosshair' );
});

http://jsfiddle.net/pUb6q/

ありがとう