How to make a flip card with dynamic content?

Question

css

Hi all. In general, the layout has the following cards:

spoiler

Cлева - передняя сторона, справа - задняя, должна появляться при клике/ховере

I reviewed a bunch of examples of flipping cards, but they are all made according to the same principle (for example, here is codepen ): the container has a fixed height, and for the front and back sides position: absolute, width: 100%, height: 100%. That is, there is no overflow processing, but I would like to make it possible to make a flex container, put as many cards as needed in it, and so that they themselves adapt in height to the largest. Actually, maybe someone saw another implementation of a similar effect, without a fixed height?

Answer 1

flip block css - search google | yandex