Css转换不起作用

我有一个场景，在这个场景中，应该发生点击按钮转换

这些是应用的转换。在chrome浏览器中，它工作得很好，但在IE11中，当尝试时，转换没有得到应用

我已经应用了CSS，如下所示：

div{
宽度：100px；
高度：100px；
背景：红色；
过渡属性：右、左；
过渡时间：2s；
-webkit转换属性：右、左；/*Safari*/
-webkit转换持续时间：2s；/*Safari*/
-ms转换属性：右、左；/*Safari*/
-毫秒转换持续时间：2s；/*Safari*/
位置：绝对位置；
右：计算（100%-100px）；
}
div:悬停{
右：0px；
}

---

根据兼容性表，您不需要使用前缀

-ms-

Chrome：对于4.0版，26.0版没有前缀使用

-webkit-

IE:10.0没有前缀

Mozilla:4.0版的16.0版没有前缀使用

-moz-

Safari:6.1没有前缀，3.1使用

-webkit-

10.5版本的Opera 12.1使用

-o-

这是因为您使用（请参见

已知问题
选项卡）：

IE11不支持转换使用calc（）设置的值

此示例适用于：


div{
宽度：100px；
高度：100px；
背景：红色；
-webkit转换属性：右、左；
-webkit转换持续时间：2s；
-ms转换属性：右、左；
-ms转换持续时间：2s；
过渡属性：右、左；
过渡时间：2s；
位置：绝对位置；
右：80%；
}
div:悬停{
右：0；
}
如另一个答案中所述，如果使用
calc
设置属性的一个或两个值，IE11在对属性应用
转换时会出现问题

一种解决方法是使用
变换设置计算的第二个值，但是，结果可能与所需动画不完全匹配。请注意，
translatex
函数中使用的百分比与元素的宽度有关


div{
背景：红色；
高度：100px；
宽度：100px；
位置：绝对位置；
右：100%；
转化：translatex（100%）；
过渡时间：2s；
过渡性质：权利、转化；
}
div:悬停{
右：0；
变换：translatex（0）；
}
写下此内容并检查头部部分：在将代码运行到浏览器之前也尝试清除缓存。这很奇怪，我到家后会通知您并检查我的IE11。在我的internet explorer上，它正在正常运行。