: root CSS import does not work in safari and IE 11

Question

:root The selector does not work in some browsers.

Code:

 :root { --blue: #4d6fd3; --yellow: #d8c812; } h1{ color: var(--blue); } h2{ color: var(--yellow); } 

 <h1>This is a heading with blue color</h1> <h2>This is a heading with yellow color</h2> 

These imported CSS are not used in Safari 5.1.7 and IE11 .

Answer 1

This css3 selector works fine in all browsers, so you have some minor issues, please look at my image and I hope this helps you.

Answer 2

I had the same problem because I had an imported vars.css file, I tried to add: root {} to the main style.css file, and it worked perfectly. I don’t know why, because it worked in other projects that I made to work with other CSS, which I imported