文本溢出:省略号跳到Android上的文本后面

时间:2012-08-08 08:20:00

标签: css3 google-chrome webkit

我试图省略带有文本溢出的h2标签。它适用于所有浏览器,但在Android上。

三个点在剪切的文本后面跳跃,因此您无法真正看到省略号。

h2的css是:

    h2 {
    font-size: 20px;
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 40%;     
}

我有很多其他风格,但无法弄清楚会对此产生什么影响。

我做了一个虚拟测试,工作正常,所以我想知道之前是否有人经历过这种行为?

2 个答案:

答案 0 :(得分:11)

所以我设法通过逐行运行css来解决这个问题。事实证明text-rendering: optimizeLegibility; 导致错误! 删除它,现在它完美无缺!

答案 1 :(得分:0)

这对我有用

基本上添加文字渲染:auto;你的css有省略号

https://github.com/driftyco/ionic/issues/663