How to make smooth centering of a block using css?

Question

css

I have a block that starts on the right of the page.
How to make its (automatic) centering smooth (as with applying transition) on pure css (i.e. no js)? If that's even possible..

Answer 1

1. Layout so that the block is centered
2. Hang animation on the block via keyframe, which at 0% moves the block to the right edge of the page through transformX, and at 100% returns it back.