Html IE10+内部嵌套3d变换溢出：自动制动：悬停行为

我在IE 10-11上使用CSS 3d转换时遇到问题 以下是我简化的HTML结构：

<ul>
    <li>Item 1</li>
    ...
    <li>Item 12</li>
</ul>

这是一个

问题是，我不能用：悬停在IE中-它们几乎从不高亮显示来设置列表项的样式 如果我们将overflow设置为hidden/visible，或者删除任何转换，那么：hover就可以了

此外，在其他浏览器中也可以很好地工作。 而且，这与变换样式无关：preserve-3d

---

什么可以解决这个问题？

经过很长时间，我在自己的环境中找到了问题的解决方案

问题是我们有另一个方法从右向左旋转元素：

transform: scale(-1, 1);

这种方法使用2d变换而不是3d变换。 这解决了IE中的问题

但若你们试着在我使用的Chrome版本42 dev-m中打开上面的提琴，你们会看到错误的滚动条。要解决这个问题，只需将零平移hack添加到所有旋转的元素中，即可将这些元素移动到单独的层上

但这一点，再次，将返回问题在IE！ 所以我不得不在这里使用浏览器检测

另外，IE渲染引擎中的错误仍然有效。这只是 针对特定问题的解决方法

还有Chrome渲染引擎中的bug

transform: scale(-1, 1);

transform: scale(-1, 1) translate3d(0,0,0);