Steps to reproduce
Edge 15 shipped with support of Custom Properties. There are, however, known issues related to their usage in pseudo-elements. These issues will hopefully be ironed out by next version. In the mean time, if you encounter issues with var() in pseudo-elements or animation of pseudo-elements, it is very likely the issue is already known.
Please add a comment here with your reduced repro instead of filing a new issue.
Comments and activity
- Microsoft Edge Team
Changed Assigned To to “James M.”
Changed Status to “Confirmed”
Thank you for providing this information about the issue. We are working on a solution for a future build of Edge, and we are presently tracking this issue as a duplicate of an existing internal bug report. We look forward to additional feedback you may have on how we can improve Microsoft Edge.
The MS Edge Team
Hey Edge team, awesome work on the newest version of Edge! I’m so excited to see the addition of support for CSS Custom Properties and I’ve been putting them to use! That being said, I’ve run into an issue when applying them to pseudo elements :before and :after and just wanted to make sure you’re aware of it.
When attempting to apply two different colors via two different custom properties as background colors for an element it’s :before or :after pseudo elements, the property set on the :before or :after will also get applied to the containing element.
Here’s a live example: https://codepen.io/brianmtreese/pen/aWmROR