The patch that landed in bug 1293099 has lines like: > list-style-image: var(--panel-arrow-image-vertical, > url("chrome://global/skin/arrow/panelarrow-vertical-themed.svg")); This however is invalid syntax, though Gecko doesn't complain. I will file a separate bug for that. This should be: > list-style-image: var(--panel-arrow-image-vertical), > url("chrome://global/skin/arrow/panelarrow-vertical-themed.svg"); In the incorrect example, only the CSS variable value will be applied. In the second example both will be applied. Tested with the attached file.

Filed bug 1294984 for the Gecko bug.

(In reply to Jared Wein [:jaws] (please needinfo? me) from comment #0) > Created attachment 8780851 [details] > cssvar.html > > The patch that landed in bug 1293099 has lines like: > > > list-style-image: var(--panel-arrow-image-vertical, > > url("chrome://global/skin/arrow/panelarrow-vertical-themed.svg")); > > This however is invalid syntax, though Gecko doesn't complain. I will file a > separate bug for that. It's not invalid syntax. The variable is used if it's defined, otherwise the URL is used. > This should be: > > > list-style-image: var(--panel-arrow-image-vertical), > > url("chrome://global/skin/arrow/panelarrow-vertical-themed.svg"); > > In the incorrect example, only the CSS variable value will be applied. In > the second example both will be applied. That produces an error when the variable isn't defined, which by default, it's not.

Closing as invalid since this is completely valid syntax and works as expected. Please reopen if you have other issues.