переход vue js не отображается правильно

Question

У меня проблема с переходами с vue js. В Chrome это вроде работает, но странно, а в Microsoft Edge вообще не отображается. Я не знаю, как это объяснить, поэтому я поставлю ссылку jsfiddle на свой код, чтобы вы могли понять, что я имею в виду. ссылка: мой код

/* animation*/
.slide-fade-enter-active,
.slide-fade-leave-active {
    transition: all .5s ease;
}

.slide-fade-enter,
.slide-fade-leave-to {
    transform: translateX(25%);
    opacity: 0;
}

Answer 1

Хорошо, я решил свою проблему, выполнив "z-index=-1;" на компоненте, но он все еще не работает...