Wiki Viewer animation issue

So I’m pretty much done with the wikipedia viewer, but I can’t figure out one thing. I decided to use this project to learn about webpack, also it’s the first time I’ve really used any animation. It all seems to work well in Chrome, but in Firefox and Edge (at least) the @keyframe only does translateY(), the rotate doesn’t work. Is this a compatibility thing? I used autoprefixer in webpack, and I’m not the best with prefixes, is that an issue? Any feedback is appreciated.

Until recently you wouldn’t be able to use new features CSS3 offers without browser specific prefix and now in the newest browser that shouldn’t be an issue… however it is good to put all vendor specific prefixes for each such rule :slight_smile:

p.box{
-webkit-transition: border-radius 1s;
-moz-transition: border-radius 1s;
-o-transition: border-radius 1s;
-ms-transition: border-radius 1s;
transition: border-radius 1s;
}

I have found this example so in all features that doesnt work use these prefixes and that should solve your issue. Hope that helps !