Bug 220798

Summary: Elements get extra pixel on the edges bleeding their parent
Product: WebKit Reporter: Yehonatan Daniv <maggotfish>
Component: Layout and RenderingAssignee: Nobody <webkit-unassigned>
Status: NEW    
Severity: Normal CC: bfulgham, simon.fraser, smoley, webkit-bug-importer, zalan
Priority: P2 Keywords: InRadar
Version: Safari 14   
Hardware: iPhone / iPad   
OS: iOS 14   
Attachments:
Description Flags
Reproduction with minimal html
none
Screenshot of reproduction on iOS none

Yehonatan Daniv
Reported 2021-01-21 08:01:20 PST
Created attachment 418042 [details] Reproduction with minimal html Steps to reproduce the problem: (1) Open the attached index.html file (2) See red lines at bottom of elements (the red background is protruding through a transparent ~1px height line of the elements on top of it) What is the expected result? Elements should cover the entire space they take without their parents bleeding. What happens instead? Each element gets extra transparent padding of ~1px that's bleeding their parents.
Attachments
Reproduction with minimal html (367 bytes, text/html)
2021-01-21 08:01 PST, Yehonatan Daniv 		no flags
Details
Screenshot of reproduction on iOS (14.02 KB, image/jpeg)
2021-01-21 08:04 PST, Yehonatan Daniv 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Yehonatan Daniv
Comment 1 2021-01-21 08:04:47 PST
Created attachment 418043 [details] Screenshot of reproduction on iOS Added a screenshot from iPhone
Yehonatan Daniv
Comment 2 2021-01-21 08:12:18 PST
And related issue in Chromium: https://bugs.chromium.org/p/chromium/issues/detail?id=1168537
Smoley
Comment 3 2021-01-21 17:54:09 PST
Thanks for filing, I can reproduce this on iOS 13.6.1 as well as the current 14.4 beta.
Radar WebKit Bug Importer
Comment 4 2021-01-21 17:54:17 PST
<rdar://problem/73477813>
Note You need to log in before you can comment on or make changes to this bug.