I have an interesting clipping issue when doing 3D rotation. I rotate the element using:
-webkit-transform: rotate3d (0, 1, 1, 180deg);
During animation, it looks great in Chrome, Firefox, and any browser other than Safari.
A window trims the elements behind it. This should not be a z-index problem, as I assigned the corresponding z-index to these elements.
Does anyone know what could lead to this happening only in Safari?
This is what Safari looks like during the animation:

And correctly animated in Chrome

Thank!
source
share