文本溢出：省略号跳到Android上的文字后面 [英] Text-overflow: ellipsis jumps behind text on Android

问题描述

我试图省略一个h2标签与文本溢出。它工作正常我所有的浏览器，但在Android。

im trying to ellipsis a h2 tag with text-overflow. It works fine i all browsers but on Android.

三个点在剪辑的文本后面跳过，因此您实际上看不到省略号。

The three dots jumps behind the clipped text so you can't actually see the ellipsis.

h2的css是：

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

我有很多其他风格，这个。

I have a lot of other styles but can't figure out what will affect this.

我做了一个虚拟测试，工作正常，所以我想知道有人经历过这种行为吗？

I did a dummy test which works fine, so i was wondering if someone experienced this behaviour before?

推荐答案

所以我设法弄清楚了，通过逐行运行css。原来是 text-rendering：optimizeLegibility;
会导致错误！
删除它，现在它工作完美！

So i managed to figure it out, by running through the css line by line. It turns out that text-rendering: optimizeLegibility; causes the bug! Removed it and now it works perfectly!

这篇关于文本溢出：省略号跳到Android上的文字后面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！