Awesome "Cog" font rotates unevenly

We use and add / remove fa-spin for certain js events. A problem that is easily visible at 3x is that the gear does not rotate around a fixed axis. I suspect this is because the icon itself (SVG) is reported by Chrome at 42 x 49 pixels, although the image is visually square. Any suggestions for resolving this issue?

It's subtle but noticeable: http://www.screencast.com/t/NwJTcKe4o

+4
source share
1 answer

A similar problem here is with the image "fa-refresh". I was able to get around this by setting a starting point in my local CSS:

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

, . , "". (fa-lg, fa-2x ..), .

, .

+1

Source: https://habr.com/ru/post/1529095/


All Articles