Content Stacking

As you can see in my CodePen example ( http://codepen.io/th...unch/pen/zvomGW ) the rendering of these animation in Safari and Chrome just totally different. In Chrome the green box overlaying the rosa box all the time, and in Safari it just crops during the rotating animation.


My goal is to make it look in safari as it looks like in Chrome. The Green box (should be a simple 2d content) should always overlay the 3d flipping element.

I dont want to move the green or rosa box along the z axis, since i dont want to change the scaling/size of the elements.


Hope you guys have some smart idea which works later dynamic in more complex situation also.

Content Stacking
 
 
Q