Mohammed Abdella
Mohammed Abdella

Reputation: 45

CSS Transform (rotation) causes text flicker in Safari 8 (yosemite)

That's was an issue with safari 7 and it was fixed by the following code

-webkit-backface-visibility: hidden;
-moz-backface-visibility:    hidden;
-ms-backface-visibility:     hidden;

Now it's not fixed in Safari 8. It causes text flicker

link http://jsfiddle.net/6x9u11c9/1/

Upvotes: 0

Views: 280

Answers (1)

Rick Doesburg
Rick Doesburg

Reputation: 663

I still haven't found a perfect solution for this problem. I have the same problem on Firefox (Yosemite).

Adding:

-webkit-transform-style:preserve-3d;
-webkit-filter: opacity(1);

to the body 'fixed' it a little. The font doesn't flicker anymore but it does become less 'bold'.

EDIT: Adding these to the body fixed the problem in Safari for me. It still occurs in Firefox as it is not a webkit browser.

-webkit-filter: opacity(.9999); -webkit-text-stroke: 0.35px;

Upvotes: 1

Related Questions