3D clipping issue in Safari only

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:

safari

And correctly animated in Chrome chrome

Thank!

+5
source share
3 answers

, , , z-index , com. p >

+1

transform-style: flat perspective. 3D-.

fooobar.com/questions/606423/... - , , Z, . .

+1

- , , actimel . (, , , 3D.)

( , , ):

-webkit-transform: translateZ(-1000px);
-webkit-perspective-origin: 100% 100% none;

! :)

0

All Articles