Why do these 3D CSS planes overlap in Firefox and Chrome and not in Safari?
http://jsfiddle.net/yNfQX/6/
..and how do I make it behave like safari?
Safari & Firefox Preview
Looks like a bug... from https://bugzilla.mozilla.org/show_bug.cgi?id=689498:
Bug 689498 - Intersecting planes are not z-ordered properly
Alistair MacDonald 2012-04-12 12:22:25 PDT Safari & Mobile Safari no longer have this problem. The problem still exists in Chrome and Firefox.
Broken: Firefox 14.0a1 (2012-04-12) -Win7 Broken: Chrome 20.0.1096.1 -Win7 Fixed : Safari 5.1.5 (75.34.55.3) -Win7 Fixed : Mobile Safari (last updated over a month ago) -iOs
Link to test-case and screen-grabs: http://f1lt3r.com/code/3d-css-transforms-intersecting-planes-not-clipping/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With