为什么我的关闭按钮会在某些浏览器中抖动?

App*_*rew 5 css css-transforms

请查看演示 - http://jsfiddle.net/cYGzC/

我们的想法是,在悬停时,十字架('×')将围绕其中心转动,这将在悬停时产生良好的旋转运动.问题是,为了正常工作,×的中心和圆的中心必须重合.

.close_button {
    background-color: #3b3b3b;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    box-shadow: 0 0 5px rgba(150,150,150,0.9);
    color: #fff;
    font-size: 40px;
    line-height: 40px;
    text-align: center;
    transition-duration: 2s;
    -webkit-transition-duration: 2s;
    -moz-transition-duration: 2s;
    -o-transition-duration: 2s;
    cursor: pointer;
}
Run Code Online (Sandbox Code Playgroud)

除了Windows中的Chrome之外,上述CSS技巧似乎在许多浏览器中都能完成.(Mac Chrome似乎工作正常.)

Kev*_*don 3

简短的答案是使用图像作为十字架。正如塔拉斯所说,不能保证字体在每个浏览器中呈现完全相同。