Contain:paint does not take rounded corners into account when clipping
Reported by
myser...@gmail.com,
Jun 1 2018
|
||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:62.0) Gecko/20100101 Firefox/62.0 Example URL: https://jsfiddle.net/p3kf3689/1/ Steps to reproduce the problem: 1. Create a div with contain:paint enabled. 2. Add a border-radius to same div. (maybe 3em or 4em) 3. Add textual content to the div. Here is the test case: https://jsfiddle.net/p3kf3689/1/ What is the expected behavior? Expected behavior is the clipping of the text to the limits of the container, which should take rounded corners into account according to the spec: https://drafts.csswg.org/css-contain/#containment-paint "The contents of the element including both the paint of the descendants and their geometry must be clipped to the padding edge of the element’s principal box, taking corner clipping into account." What went wrong? It clipped to the padding box only without considering the rounded corners. Does it occur on multiple sites: N/A Is it a problem with a plugin? No Did this work before? N/A Does this work in other browsers? N/A Chrome version: <Copy from: 'about:version'> Channel: n/a OS Version: 10.0 Flash Version:
,
Jun 3 2018
,
Jun 4 2018
,
Jun 4 2018
Works in Chrome 67. |
||||
►
Sign in to add a comment |
||||
Comment 1 by myser...@gmail.com
, Jun 1 2018