How to remove jitter from animation?

Question

css

Example
How can I get rid of the jitter of elements during animation?
Perhaps there is some js library with a similar animation?

Answer 1

Shaking due to table-cell and align: midle; well, because of slide:after
And in general the table is useless there.
The simplest inline-block; for vertical alignment line-height: 100vh;
all.
Well, a tweaked example: tynts .
This is just an example, of course, you need to edit it the same way.

Answer 2

What's shaking there? Maybe hands?))) Everything seems to be correct)