CSS头痛（a：悬停）与Chrome浏览器。

我的元素在Chrome中工作不正常（鼠标悬停在图标上不工作）。但是，firefox显示它很好

代码笔源

我真的很感激你们的帮助！你可以帮我省下几个小时的谷歌搜索时间

---

谢谢

transform

属性在chrome中还不起作用。此外，您还需要在悬停时使用

-webkit transform

，如下所示：

.opentime .timelineopening li .roundbox:hover { 
   transform: scale(1.15) ! important;
  -webkit-transform: scale(1.15) ! important;
  transition: all 250ms ease-in-out 0s ! important; 
}

（事实上，这段代码片段在你的代码笔上帮了我的忙）

---

此外，不建议使用如此复杂的选择器结构，可能是简单的

。roundbox:hover

可以吗？

对于safari和chrome等webkit浏览器，CSS转换和转换需要以

-webkit-

作为前缀

在这里检查这个

.opentime .timelineopening li .roundbox:hover {
    -webkit-transform:scale(1.15) !Important;
    -webkit-transition: all 250ms ease-in-out 0s ! important;
    transform: scale(1.15) ! important;
    transition: all 250ms ease-in-out 0s ! important;
}
.opentime .timelineopening li .roundbox:hover .dayname {
    font-size: 0px;
    transition: all 300ms ease-in-out 0s;
    -webkit-transition: all 300ms ease-in-out 0s;
}
.opentime .timelineopening li .roundbox:hover span.icon1 {
    opacity: 1;
    transition: all 300ms ease-in-out 0s;
    -webkit-transition: all 300ms ease-in-out 0s;
}

---

你能把代码简化成一个更小的测试例子吗。在这里粘贴按钮的html和CSS怎么样？Lokesh，这真的很有用！谢谢！