列表项内 "overflow: hidden" 的块在边缘上向下移动

Question

这可以通过 Bilal Akil 在 this question 中发布的代码示例观察到：

http://jsfiddle.net/G46dK/

<ol>
    <li>
        <p>
            Moo
    <li>
        <p class="overflow-hidden">
            Moo
    <li>
        <p class="overflow-hidden">
            Moo
    <li>
        <p>
            Moo
</ol>

附带CSS:

p.overflow-hidden {
    overflow-x: hidden;
}

在 Edge 上，内容显示如下，这对我来说像是一个错误：

在 li 中使用 overflow: hidden 时，有没有想过让内容与列表编号保持在同一行？

[编辑]：这个问题是关于处理 LI. 中带有 overflow: hidden 的块我很欣赏尝试通过将溢出移到块外来解决问题的答案，但我真正想要的是尊重此约束的解决方案。您还可以查看此 fiddle 以获得更高级的示例：http://jsfiddle.net/G46dK/7

Answer 1

制作.overflow-hidden { display: inline-block; }怎么样？ http://jsfiddle.net/G46dK/8

.overflow-hidden {
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  width: 100%;
}