li IE9中的元素编号向右下移动

li Element Numbering in IE9 moving towards right bottom

每次我刷新页面内容时,li 元素中的编号在 IE9 中移向右下角,但在其他浏览器(firefox 和 chrome)中工作正常。这是否需要特定于 IE 的修复,还是我犯了一个错误?

Javascript:

if (jQuery("#" + divName).html() == "") {
    document.getElementById(divName).innerHTML = content;
}

CSS:

ol.rounded {
    counter-reset: my-counter;
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
ol.rounded li {
    margin-bottom: 9px;
    padding-left: 25px;
    position: relative;
}
ol.rounded li:before {
    border: 10px solid #69b13b;
    border-radius: 50%;
    content: "";
    height: 0;
    left: 2px;
    position: absolute;
    top: -3px;
    width: 0;
    z-index: -1;
}
ol.rounded li:after {
    color: #FFFFFF;
    content: counter(my-counter, decimal);
    counter-increment: my-counter;
    font-size: 1.2em;
    font-weight: bold;
    left: 8px;
    position: absolute;
    top: 1px;
}

HTML:

<ol class="rounded">
    <li>
        <p>Abhishek Agarwal</p>
    </li>
</ol>

每次刷新时,css(已存在于页面中)再次添加到头部。由于多个 css 应用的 li 元素在移动。