font-awesome - Font Awesome “Cog” 旋转不均匀

Question

我们在某些 js 事件上使用和添加/删除 fa-spin。问题在 3 倍时很容易看到，是齿轮不绕固定轴旋转。我怀疑这是因为图标本身 (SVG) 由 Chrome 报告为 42 x 49 像素，即使图像在视觉上是方形的。有什么建议可以解决这个问题吗？

这是微妙但引人注目的： http ://www.screencast.com/t/NwJTcKe4o

Answer 1

这里的“fa-refresh”图像存在同样的问题。我可以通过调整本地 CSS 中的原点来解决它：

.fa-spin {
    -webkit-transform-origin: 35% 50%;
    -ms-transform-origin: 35% 50%;
    transform-origin: 35% 50%;
}

一个黑客，但它的工作。测试了其他一些图标，它们也显得“居中”。但是，如果您强制使用更大的图标（fa-lg、fa-2x 等），则需要调整这些数字。

我不确定是什么原因造成的。