CSS Flip Card che non ruota correttamente.

[albertobellomi]

Ciao ragazzi,

non riesco a risolvere questo fastidioso problema del back panel di questa Flip Cardhttps://codepen.io/albertobellomi/pen/GRZobqw).

Il testo del back panel non ruota correttamente di 180deg, come dovrebbe, questo succede in tutti i browser.
Oltre al testo anche il background sotto al back non ruota correttamente.

Qualcuno mi può aiutare a risolverlo? Grazie

 

[MichPower]

Ciao @albertobellomi,

potresti risolvere il problema velocizzando il flip della card. In questo modo non vedo problemi e gira correttamente.
Il problema a me capita quando passi più volte sopra (quando effettui molte volte l'hover in altre parole) e la transizione precedente si overlappa con quella di ritorno.

Riducendo non mi dà nessun problema.
Non so se lo vuoi più lento o che ad un certo punto, quando non sei più in hover e sta ancora facendo la transizione di apparizione della scritta, si deve fermare e/o tornare indietro.

Basta modificare su

.flip-card

e abbassare a 0.1s.

Si, è un hack e lo ammetto ma worka senza stravolgere codice ed impazzire.

MP