开发者

Internet Explorer OL problem with decimals over 9

In my website, I've got an ol with decimals (list-style-type:decimal). In Internet Explorer, when the list gets over 9 the decibel starts at 0 again.

This is how it should be displayed, and how it's displayed in Firefox:

Internet Explorer OL problem with decimals over 9

This is how Internet Explorer 7 and 6 displays it (IE8 not tested yet):

Internet Explorer OL problem with decimals over 9

So the list starts at zero again.

CSS of the list:

ol {
    list-style-image:none;
    list-style-position:outside;
    list-style-type:none;
}
ol li {
    list-style-position:outside;
    list-style-type:decimal;
    margin:5px 0 5px 23px;
}

edit: And my css reset file adds this (this comes from firebug):

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead {
    -moz-background-clip:border;
    -moz-background-inline-policy:continuous;
    -moz-background-origin:padding;
    background:transparent none repeat scroll 0 开发者_如何学编程0;
    border:0 none;
    font-size:100%;
    margin:0;
    outline-color:-moz-use-text-color;
    outline-style:none;
    outline-width:0;
    padding:0;
    vertical-align:baseline;
}

Who knows how to fix this?


The numbers are cut off by the margin. Increase it, and you'll see the tens-place digits.

ol li {
    margin-left: 2.5em;
}

or you can modify it as

padding-left : 30px


It's because of the margin:0; in your css reset file.


A specific answer for users in the future who have this problem: the left margin has to be at least 30px to display double digits in IE.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜