Html 如何让translateX转换在firefox中工作？

这段代码可以在Chrome中使用，但不能在Firefox中使用。有没有办法解决这个问题？当你将鼠标悬停在门上时，门应该是打开的，并且横向图像将滚动显示，但在Firefox中，门不会完全打开，除非鼠标位于右边缘。（我不允许更改html或使用css以外的任何内容）

15

因为您是

translate（）

-ing

.door

（它将移动

.door

），所以当您悬停父

li

时触发转换，而不是当您悬停

.door

时

#日历{
宽度：550px；
保证金：0自动；
溢出：隐藏；
}
#日历里{
列表样式：无；
浮动：左；
宽度：110px；
高度：110px；
位置：相对位置；
溢出：隐藏；
利润率：30像素；
背景图片：url(http://i.imgur.com/C68wDiS.jpg);
}
.门{
宽度：110px；
高度：110px；
位置：绝对位置；
顶部：0px；
左0px；
颜色：白色；
文本对齐：居中；
字体系列：“Oswald”，无衬线；
字体大小：50px；
垂直对齐：中间对齐；
线高：110px；
转换：转换1s轻松输入输出；
背景颜色：灰色；
}
#日历李：悬停。门{
转换：translateX（110px）；
}
#日历li：悬停{
动画：滑入滑出四个3；
}
@滑动四个关键帧{
0% {
背景位置：0px；
}
100% {
背景位置：-330px；
}
}

15

@-moz关键帧 -moz动画 我希望这张照片能帮助你：） 给你。试试这个

-webkit-transform: translateX(110px); /* Chrome, Safari, Opera */
-moz-transform: translateX(110px); /* Firefox */
-ms-transform: translateX(110px); /* IE 9 */

-webkit-transform: translateX(110px); /* Chrome, Safari, Opera */
-moz-transform: translateX(110px); /* Firefox */
-ms-transform: translateX(110px); /* IE 9 */