getComputedStyle(element).getPropertyValue("--varName") does not work in firefox

118 Views Asked by At

Well, I want to use some css vars in my js code.

Here is the part of my .css file and the .js code:

const root = document.querySelector(":root");
const msgColor = getComputedStyle(root).getPropertyValue("--msg-color");
console.log(msgColor);
:root {
  --msg-color: crimson;
  --msg-text: floralwhite;
}

The problem is that in chrome, safari and the new Edge I'm getting right the color value in my constant, but in firefox, doesn't working.

Any ideas? Thanks.

1

There are 1 best solutions below

0
On

It seems it was the version of firefox. It was the 68.x.x Now with the 77.0.1 works fine.