为什么WebKit没有正确地重绘这个文本？

Question

我对WebKit渲染器有一个非常具体的问题。当文本节点具有超出文本节点选择框的下延器或上升器，并且该文本节点更改位置时，WebKit不会重新绘制正确的区域。

I've made an example with Open Sans.

在Windows 7的Chrome中，J上的下降器在动画期间被切断。我可以通过在文本节点上添加一个边距来修复它，但这有点像黑客攻击并且它与布局有关。有没有人在其他浏览器中看到这个？为什么会这样？

Answer 1

我在padding-left: 5px;规则上投了#container p，J在框外。

希望有所帮助。

*编辑 我想念了，不确定填充物是否也会弄乱你的布局，我想是这样。

Answer 2

这看起来像Webkit中的一个错误。你需要让Webkit知道在它的边界框之外有画像素，你可以通过几种方式做到这一点，但这里有两个我通过一些快速测试找到的：

#expand {
    height: 0px;
    box-shadow: 0 0 0 5px rgba(0,0,0,0);
}

#expand {
    height: 0px;
    outline: solid transparent 5px;
}

我猜outline表现更好。

如果您添加#expand或p，它似乎也有效。 Chrome中有一些标记，你可以看到重绘区域的工作原理，但我现在还没有方便。