Having problem adding fallback to the background property of the ```.red-box`` class. before existing declaration and set value to red

Tell us what’s happening:

Your code so far


<style>
 :root {
  --black-color: red;
}
.red-box{
  background: red;
}

.red-box {
  background: red;
  background: var(--black-color);
  width: 200px;
  height: 200px;
}
</style>
<div class="red-box"></div>

Your browser information:

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) snap Chromium/78.0.3904.108 Chrome/78.0.3904.108 Safari/537.36.

Challenge: Improve Compatibility with Browser Fallbacks

Link to the challenge:
https://www.freecodecamp.org/learn/responsive-web-design/basic-css/improve-compatibility-with-browser-fallbacks

Hi lone-24, welcome to the forum.

What problems are you having with this challenge? You have changed some things in the original code, and I think they are causing problems.

For example, why did you change the variable name to --black-color?

 :root {
  --black-color: red;
}

I suggest resetting the code and trying again. Only add one line as the instructions say, and don’t change anything else.