所以这就是问题所在。该页面可在浏览器中编辑。当我添加内容并创建一个新的列表项时,IE会产生一些奇怪的结果。不正确创建列表项。这在Firefox和Chrome中都有效。这种样式的原因是自定义缩进以使包装文本排成一行。我必须使用display:table,display:table-row和display:table-cell,以便正确对齐。
html:
<ol contenteditable="true">
<li>this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test </li>
<li>this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test</li>
</ol>
CSS:
ol {
counter-reset: item;
display:table;
margin-left:10px;
padding:0px;
}
ol li:before {
content: counter(item, decimal) ".";
counter-increment: item;
margin-right: 10px;
font-weight: bold;
display:table-cell;
width:1.6em;
}
ol li{
display:table-row;
}