Animatable z-index property seems to ignore transitions, and changes its value from the source z-index to the target z-index without animating. Steps to reproduce the bug: 1. Create 5 multilayered elements through z-index and absolute/fixed position. Several elements with different widths will help checking if the transition is working. 2. Set the top element to transition in 0.5 seconds between the highest and the lowest z-index when you :hover the parent element. Example created in JSFiddle: https://jsfiddle.net/Birckin/od56cbxL/2/ Actual results: The element doesn't perform a z-index transition, it just change its value to the target z-index. In the example, the element passes from being visible at the top to being hidden at the bottom instantly. Expected results: The element should move through the z-index values while transitioning, revealing every layer of those multilayered elements one by one.
In Safari 10.1 and a WebKit nightly the result looks the same as Firefox to me (but Chrome is different).