| Summary: | Ugly border rendering with background-clip and border-radius | ||||||
|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | Simon Fraser (smfr) <simon.fraser> | ||||
| Component: | CSS | Assignee: | Simon Fraser (smfr) <simon.fraser> | ||||
| Status: | RESOLVED CONFIGURATION CHANGED | ||||||
| Severity: | Normal | CC: | ahmad.saleem792, ap, bfulgham, simon.fraser, zalan | ||||
| Priority: | P2 | ||||||
| Version: | 528+ (Nightly build) | ||||||
| Hardware: | Unspecified | ||||||
| OS: | Unspecified | ||||||
| Attachments: |
|
||||||
It's not obvious from http://www.w3.org/TR/css3-background/ that background-clip: content-box; should cause the background to get clipped to a non-rectangular area, but Firefox does it. I updated this test case by removing -webkit- prefixes: Link - https://jsfiddle.net/hkoq0v24/show I am not able to find differences between all browsers (Chrome Canary 107, Firefox Nightly 106 and STP 152). Appreciate if someone can confirm whether it is reproducible for them or not? Thanks! Not sure who changed, but identical results from all browsers strongly suggest that there is nothing to do here. |
Created attachment 95082 [details] Testcase WebKit has incorrect rendering of rounded, transparent borders if the element has -webkit-background-clip: content-box. See testcase.