Hello everyone! I’m facing a very weird bug that appears to happen just on IOS devices.
I needed a custom-shaped rectangle for the design and chose the rotation option.
I set a perspective for parent element and set Y-rotation for the child element.
Set position absolute for child element, a little bit more of play with position at it looks fine.
On top of that, I have a container with text that I set Z-Index for.
That’s how it looks in the preview, on desktop and android devices.
That’s how it looks on IOS 14:
It cuts off the text in the middle (that’s the rotation point), and appears to show that block on top of the text.
I already tried playing with z-index and it doesn’t work.
Any ideas on how to fix this?
Or maybe there are better options to create a custom shape like this?
Thank you for any ideas!
Here is my site Read-Only: Webflow - Alek's Detailing