Почему transform-origin (50% 50%) не работает в анимации SVG в современных браузерах?

Некоторые причины, по которым свойство transform-origin с процентными значениями, например 50% 50%, может не работать в анимации SVG в современных браузерах:

• Различия в реализации. www.itcodar.com Например, Chrome реализовал transform-origin раньше, чем была завершена спецификация, и обрабатывает процентные значения иначе. www.itcodar.com Firefox ведёт себя в соответствии со спецификацией. www.itcodar.com
• Баги. www.devasking.com В некоторых браузерах, таких как Safari, есть ошибки в работе webkit, и они могут ещё не содержать новых изменений. www.devasking.com
• Конфликты с другими свойствами. www.devasking.com sky.pro Например, в Firefox работают только значения длины, а проценты и ключевые слова — нет. www.devasking.com Также могут возникнуть конфликты между плавными CSS-анимациями и трансформациями. sky.pro
• Особенности браузера. yoksel.github.io Например, в IE11 не работает transform-origin, заданный в процентах, при этом ломается весь фон. yoksel.github.io

Чтобы сделать анимацию совместимой со всеми браузерами, можно использовать абсолютные координаты вместо процентных значений. www.itcodar.com