Open
Bug 664154
Opened 13 years ago
Updated 2 years ago
Background from parent element border-radius clipping bleeds through to child
Categories
(Core :: Graphics: WebRender, defect)
Core
Graphics: WebRender
Tracking
()
NEW
People
(Reporter: j, Unassigned)
References
(Blocks 1 open bug, )
Details
Attachments
(1 file)
(deleted),
text/html
|
Details |
User-Agent: Mozilla/5.0 (X11; Linux i686; rv:2.0.1) Gecko/20100101 Firefox/4.0.1 Build Identifier: Mozilla/5.0 (X11; Linux i686; rv:2.0.1) Gecko/20100101 Firefox/4.0.1 Please see the demo above. Part of the red background from the parent element clearly bleeds into the yellow background of the child element. Reproducible: Always
Updated•13 years ago
|
Blocks: border-radius
Component: Layout: Block and Inline → Layout: View Rendering
Depends on: 466572
QA Contact: layout.block-and-inline → layout.view-rendering
![]() |
||
Comment 2•13 years ago
|
||
This isn't a layout issue, really; it's a graphics issue. The problem is that when clipping the border to the rounded corner we antialias it, and drawing two antialiased edges on top of each other doesn't completely hide the bottom edge, of course. WebKit, unsurprisingly, has the same behavior (at least both Chrome and Safari on Mac do). I'm not sure there's actually a way to do this "right"...
Component: Layout: View Rendering → Graphics
QA Contact: layout.view-rendering → thebes
I recall that Microsoft made a big thing out of having the only browser to be able to render "perfect" border-radius curves. Would anyone with a compatible OS see if/how they've solved it?
![]() |
||
Comment 4•13 years ago
|
||
IE9 has exactly the same red fringe that I see in Gecko and WebKit on the attached testcase.
![]() |
||
Comment 5•13 years ago
|
||
I guess one way to try to deal with this would be to paint the backgrounds to the square area and then later clip the result to the rounded-corner area....
![]() |
||
Updated•13 years ago
|
Status: UNCONFIRMED → NEW
Ever confirmed: true
Updated•2 years ago
|
Severity: normal → S3
Comment 8•2 years ago
|
||
Still reproduces in recent versions.
Severity: S3 → --
Component: Graphics → Graphics: WebRender
OS: Linux → Unspecified
Hardware: x86 → Unspecified
Comment 9•2 years ago
|
||
I can't find a clear regression range with WebRender force enabled. I'm seeing this as far back as Firefox 61.0a1 (20180320220122). From Firefox 73 to 81, it looks different, but still wrong.
You need to log in
before you can comment on or make changes to this bug.
Description
•