'Flipbook page backside not showing on Safari

I'm trying to make a flipbook for my website, but I've noticed that the back side of pages don't show up properly on Safari. I've tried all sorts of webkit fixes, including -webkit-backface-visibility, as well as some z-index fixes, yet nothing seems to work.

Here is my code and example on CodePen. On all other browsers, a "1" will appear on the left page, called .back in the code. However, on Safari, I am met with a blank page.

How do I get this working in Safari? Note: It technically works in mobile Safari, but only because I never use the back side of a page to display anything.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source