When 3d rotating absolutely positioned elements that lie over each other, Chrome/Firefox/IE will display elements in their entirety on top of each other. Safari

When 3d rotating absolutely positioned elements that lie over each other, Chrome/Firefox/IE will display elements in their entirety on top of each other. Safari gets them to intersect with each other in weird-yet-mysterious ways that I've never been able to fathom[1]. If Safari recognises and/or honours the backfaceVisibility CSS property, then I've yet to implement it correctly on a web page[2]. Safari doesn't allow SVG filters to be applied to <canvas> elements[3]. Applying SVG filters to other elements is (I think) fine. Talking about Safari and the <canvas> element, Safari will show an italicised text (ctx.font = "italic 12px Arial, sans-serif") to be stamped onto the canvas, but emboldened text (ctx.font = "bold 12px Arial, sans-serif") displays as normal, non-bold text. If you want bold text to show in a canvas element on Safari, you need to use a specifically emboldened font.[4] ... the list could go on (and on) ... Examples [1] - https://scrawl-v8.rikweb.org.uk/demo/dom-002.html https://scrawl-v8.rikweb.org.uk/demo/dom-002.html [2] - https://scrawl-v8.rikweb.org.uk/demo/dom-008.html https://scrawl-v8.rikweb.org.uk/demo/dom-008.html [3] - https://scrawl-v8.rikweb.org.uk/demo/filters-501.html https://scrawl-v8.rikweb.org.uk/demo/filters-501.html [4] - https://scrawl-v8.rikweb.org.uk/demo/canvas-016.html https://scrawl-v8.rikweb.org.uk/demo/canvas-016.html