CSS Custom Property value for background-color isn't applied to dialog::backdrop pseudo element
Reported by
meriha...@gmail.com,
Mar 11 2016
|
|||
Issue descriptionUserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.87 Safari/537.36 Example URL: Steps to reproduce the problem: When given a CSS variable value to background-color property, that value is not applied to ::backdrop pseudo element of dialog element. Attached a test case. What is the expected behavior? The resolved value of CSS variable should be applied to background-color of ::backdrop pseudo element. In the test case, the background should be green. What went wrong? CSS variable is not applied at all. The background is red. Does it occur on multiple sites: N/A Is it a problem with a plugin? No Did this work before? No Does this work in other browsers? Yes Chrome version: 49.0.2623.87 Channel: stable OS Version: OS X 10.11.3 Flash Version: Shockwave Flash 21.0 r0
,
Mar 14 2016
I made a jsfiddle of the testcase: https://jsfiddle.net/tezfswcj/1 I was not able to get this working on Firefox or Safari though - I think we're the only ones who implement it. cc'ing shans who has been working on custom properties.
,
Mar 14 2016
I think this is working as intended. The spec says, of the ::backdrop pseudo-element, that it "does not inherit from any element". This means that if you only set the --bg-color property on :root, it will not end up being set on the ::backdrop because the pseudo-element won't inherit it from the dialog element. If you set the custom property on the pseudo-element it works fine. https://fullscreen.spec.whatwg.org/#::backdrop-pseudo-element
,
Mar 17 2016
Yep, that looks like the right explanation to me. |
|||
►
Sign in to add a comment |
|||
Comment 1 by phistuck@chromium.org
, Mar 11 2016Components: Blink>CSS
Labels: -Type-Compat Type-Bug
Status: Untriaged (was: Unconfirmed)