0

如何在 html 编号列表中对齐两位数？我有一个列出 14 个项目的有序列表。在除 ie7 之外的所有浏览器中，它都可以正常工作。但在 IE7 中似乎删除了有序列表中两位数后的空格。

<ol>
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
 .....

</ol/>

IE7中的输出就像

1.aaa
2.bbb
3.ccc
....
10.kkk
11.lll

我不知道为什么它从 10 开始删除点 (.) 之后的空格。
任何人请建议我一个解决方案

4

1 回答 1

0

In css, you could try something along the lines of

ol{
  left-padding: 2em;
}
ol li{
  left-padding:0.5em;
}

It might let you keep the spacing consistent between the number and the content of the li. I haven't seen anyone alter the alignment of the numbers in an <ol> in IE7.

Alternatively, if it's not a big pain you could add the numbers manually, something like

<ul>
  <li><em>1.</em>Apple</li>
  <li><em>2.</em>Banana</li>
  ...
  <li><em>14.</em>Orange</li>
</ul>

And use css like:

li{
  list-style-type: none;
  clear: left;
}
li em{
  float: left;
  width: 2em;
  margin-right:0.5em;
  text-align: right;
}

With that, you would have the effect you want.

于 2012-05-02T10:03:24.977 回答