有序列表在firefox 57中没有增加

Question

我在Firefox 57中遇到了一个问题，其中包含html中的有序列表。

html是动态生成的，但示例如下所示：

<ol>
  <li>ashdg</li>
  <li>ashdg</li>
  <li>ashdg</li>
</ol>

它有以下CSS

ol{
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    list-style-type: decimal !important;
    list-style-position: inside !important;
}

p, ul, ol {
    padding: 0;
    margin: 0;
    display: inline;
}

firefox输出

Chrome输出

Answer 1

这是由display: inline提供的，但我不知道为什么这会重置Firefox中列表的顺序。我不会说这是直观和预期的，所以在我看来，这是错误。如果不需要inline属性，只需删除CSS中的ol即可。如果 是必要的（因为您希望它们在一行中），则使用float代替display: inline有一种解决方法。

ol{
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    list-style-type: decimal !important;
    list-style-position: inside !important;
}

p, ul, /* ol <-- remove this, if not necessary */ {
    padding: 0;
    margin: 0;
    display: inline;
}

/* add this, if necessary */
ol li {
    float: left;
}

<ol>
   <li>ashdg</li>
   <li>ashdg</li>
   <li>ashdg</li>
</ol>

Answer 2

只需替换这个::

p, ul, ol {
    padding: 0;
    margin: 0;
    display: inline;
}

通过::

p, ul, ol {
    padding: 0;
    margin: 0;
}

Answer 3

您是否尝试在任何属性中添加一个带有-moz前缀的新属性？与moz-grid，-moz-appearance一样。 你自然不需要这个，但你可以试试。 还要检查是否有另一个css代码更改了您的ol属性（也请检查-moz）。

这没有意义，但看起来display:inline会使它看起来像“一行列表”，而Firefox中的ol会计算行中的方框。