文本溢出:省略号跳到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!