I have an issue with Safari with webkit transform.
I’am using following to center text elements in Webflow: Center class on screen vertical / horizontal
The settings work and seems fine when looking in Browser Inspector where the code is deployed (not hosting using webflow), and off course also in Webflow Preview. The code works on android/chrome devices, but on iOS/Safari devices, the elements is not vertically and horizontal centered.
The text is placed inside a DIV, when a Interaction function when Hover on the image the text also appear.
Could it be the interaction which makes the issue?
background-color: hsla(0, 0%, 100%, .24);
position: relative !important;
top: 50% !important;
display: block !important;
-webkit-transform: translate(0px, -50%);
-ms-transform: translate(0px, -50%);
transform: translate(0px, -50%);