Bug 200705

Summary:

background-clip: text and rotation shows pixel artifacts

Product:

WebKit

Reporter:

Mark cormack <markcormack>

Component:

Layout and Rendering

Assignee:

Nobody <webkit-unassigned>

Status:

RESOLVED DUPLICATE

Severity:

Normal

CC:

bfulgham, simon.fraser, webkit-bug-importer, zalan

Priority:

Keywords:

InRadar

Version:

Safari 12

Hardware:

All

OS:

All

Attachments:

Description	Flags
Contains image of results, HTML to reproduce issue	none
Testcase	none

Mark cormack

Reported 2019-08-14 01:37:21 PDT

Created attachment 376249 [details] Contains image of results, HTML to reproduce issue Using -webkit-background-clip and using transform: rotation has the desired result of clipping and rotating text, but has the side effect of adding a slim 0.5 pixel dashed border. This occurs independent of the font used, so not related to the font. Removing rotation fixes issue. This issue is specific to Webkit Safari both on iPhone and Mac using latest OS. Handles as expected without border in Chrome/Chromium Edge/Firefox. Work around: use SVG text element instead to achieve the same effect without the border. Test file attached to reproduce this issue

Attachments
Contains image of results, HTML to reproduce issue (506.92 KB, application/zip) 2019-08-14 01:37 PDT, Mark cormack	no flags	Details
Testcase (3.26 KB, text/html) 2019-08-14 16:57 PDT, Simon Fraser (smfr)	no flags	Details
View All Add attachment proposed patch, testcase, etc.

Radar WebKit Bug Importer

Comment 1 2019-08-14 16:55:59 PDT

<rdar://problem/54325642>

Simon Fraser (smfr)

Comment 2 2019-08-14 16:57:47 PDT

Created attachment 376333 [details] Testcase

Simon Fraser (smfr)

Comment 3 2023-04-28 11:57:13 PDT

Only seems to happen when there's a transform on some ancestor.

Simon Fraser (smfr)

Comment 4 2023-04-28 12:27:27 PDT

*** This bug has been marked as a duplicate of bug 179333 ***

Note You need to log in before you can comment on or make changes to this bug.