Anti-aliasing not working in Chromium

I recently had to use the CSS3 property transform, in its « rotate » version. This property being currently supported by all modern browsers – but with vendor prefixes -, I thought it would be rendered the same anywhere.

It was not, not really.

In Chromium, -webkit-transform:rotate(4deg) on a container led to horribly aliased edges for this container. After some research, it appears that it was a WebKit engine bug, not solved for now. Tragedy! Horror! Pickles! Should my design be thrown away? No, don’t weep in sorrow: there is a way.

Others have the same problem:

And others know how to solve it:

The key is backface-visibility: It’s linked to 3D effects, and I must admit I don’t know why it corrects aliasing. I’ll search a little more 😉

Commentaires fermés sur Anti-aliasing not working in Chromium

Les commentaires sont fermés.