How to start an animation of an element in css from its current position not its initial position?

Answer 1

Why current position different from initial one?

Answer 2

Calviղ , because I've transformed the element to its different state respected to it initial (origin) state. Ex- rotate, translate, skew etc.

Answer 3

set the current position on @keyframes from {}