Google chrome 使用CSS设置“left”动画时，在Chrome中对文本进行奇怪的剪切/拉伸

当我对包含文本的元素的位置设置动画时，我在谷歌浏览器中看到了一种非常奇怪的效果

如果没有动画，部分文本将被其父元素的边界隐藏。当我使用

@keyframes

设置

left

属性的动画时，它的一部分会被重复复制或拉伸。这在Firefox中似乎不会发生，在CSS模式等不同内容中也不会发生

我无法想象我是第一个发现这个的人。这是一个已知的问题吗？是否有我可以阅读的bug报告

例如：

演示：

html，正文{
身高：100%；
保证金：0；
}
身体{
显示器：flex；
弯曲方向：立柱；
证明内容：中心；
对齐项目：居中；
}
.集装箱{
宽度：10em；
溢出：隐藏；
边缘：1米；
}
.文本{
空白：nowrap；
位置：相对位置；
动画名称：字幕；
动画持续时间：3s；
动画迭代次数：无限；
动画方向：交替；
}
@关键帧选框{
从{左：0；}
到{左：-100%；}
}

现在是所有好人来帮助他们的政党的时候了。

我也遇到了类似的问题。这个问题与webkit有关。 要解决此问题，请包括

body{
       -webkit-backface-visibility: hidden;
     }

---

如果您在Chrome上遇到持续存在的异常动画问题，请使用相同的代码。

这真的很奇怪。它绝对解决了问题，但没有意义，因为元素或其容器没有应用

透视

或

旋转

。我真的在寻找一个解释为什么会发生这种情况。我打算等一天左右再接受你的回答，以防万一有人能解释清楚。我还应该注意到，它在所有主要浏览器上都有非常好的浏览器支持，没有

-webkit-

前缀。