ios - 文本溢出 : ellipsis ignoring right padding on mobile

Question

我有一个 div 样式，用省略号截断居中的文本，每边都有一些填充。它在使用桌面浏览器时有效，但在 iPad 上，文本似乎忽略了正确的填充并且错误地居中。

我用它来做样式:

div {
    text-overflow: ellipsis;
    width: 120px;
    padding: 0 38px;
    overflow: hidden;
    white-space: nowrap;
    border: 1px solid black;
    text-align: center;
}

可以在这里看到一个例子。在 iPad 上查看以查看问题。 http://jsfiddle.net/35Lyk9yp/

我想这可能是移动浏览器的一些错误？它在 iOS Safari 或 Chrome 上不起作用，但在 Windows Safari 和 Chrome 和 Firefox 上没问题。有没有简单的解决方法？

编辑:

我找到了一个解决方法，即使用内部 div 和我用来做省略号的内容，然后使用外部 div 设置填充。如果有一种方法可以用一个元素解决它，请告诉我。

Answer 1

为了让您的代码正常工作，您需要有 CSS overflow、width 和 display。

您可能错过了显示。