跨浏览器兼容列表缩进

Question

我有一个无序列表,我试图控制悬挂缩进.对于溢出到两行的项目,我希望第二行文本直接排在前一行文本下面(不在项目符号下面).我完全按照我想要的方式在Chrome中使用它.然而,它在Firefox和Internet Explorer中有点偏差.

这是我现在拥有的:

<ul style="list-style: disc inside none; margin-left: 0; padding-left: 1em; text-indent: -1em;">
<li>50 – 180</li>
<li>950 – 2150</li>
<li>Dual IF: 70/140, L-Band & L-Band monitor (standard)</li>
</ul>

有没有办法在所有浏览器中使这个渲染相同？

Answer 1

删除text-indent,更改list-style到outside,并应用padding-left到你的li要素:

ul {
    list-style: disc outside none; 
    margin-left: 0; 
    padding-left: 1em;
}
li {
    padding-left: 1em;
}