RESOLVED DUPLICATE of bug 27684 119259
Scaling via "-webkit-transform: scale();" is fuzzy (as if a bitmap) when "-webkit-backface-visibility: hidden" is added 
https://bugs.webkit.org/show_bug.cgi?id=119259
Summary Scaling via "-webkit-transform: scale();" is fuzzy (as if a bitmap) when "-we...
ar
Reported 2013-07-30 07:30:48 PDT
Created attachment 207735 [details] Testcase: Reference Screenshot Adding "-webkit-backface-visibility: hidden;" to a vector element (ex: Type) with "-webkit-transform: scale();" causes the scaled element to *not* be rendered at high quality. In other words, it's fuzzy. It's scaled up as if it were a bitmap image instead of a vector shape. Test Case: http://jsfiddle.net/ar_fiddles/aLVf8/ Browsers Tested + Results: Safari: All Fuzzy (bug) - 5.1.9 (6534.59.8) - 6.0 - iOS 6 Chrome (Mac/Win): 28.0.1500.71: Sharp (no bug) 28.0.1500.12 (iOS): Fuzzy (bug) (Not sure if this is related to it being the mobile version, or if a fix was introduced somewhere between xxxx.12 and xxxx.71) Firefox (Mac) - 22.0: Sharp (no bug) Related: "No anti aliasing on scaled elements when backface-visibility:hidden is set" https://code.google.com/p/chromium/issues/detail?id=144884 Possibly Related: "backface-visibility:hidden does not make RenderLayers, and should" https://bugs.webkit.org/show_bug.cgi?id=24435
Attachments
Testcase: Reference Screenshot (15.64 KB, image/png)
2013-07-30 07:30 PDT, ar 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
ar
Comment 1 2013-07-30 07:45:17 PDT
Should have been more specific with the iOS version: iOS 6.1.3 (10B329)
ar
Comment 2 2013-07-30 07:54:36 PDT
Other places where people have run into this: "Webkit - Font Smoothing" https://github.com/woothemes/FlexSlider/issues/222 "Blurry fonts in Mobile Safari & Safari" https://github.com/iosscripts/iosSlider/issues/97
Simon Fraser (smfr)
Comment 3 2013-07-30 10:27:37 PDT
*** This bug has been marked as a duplicate of bug 27684 ***
Note You need to log in before you can comment on or make changes to this bug.