Attach a Fallback value to a Variable

Tell us what’s happening:
I been trying to understand what I need to do here but I not sure.
I know that I need to add a fallback value, with the color red.

Your code so far


<style>
:root {
  --red-color: red;
}



.red-box {

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

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.4183.121 Safari/537.36.

Challenge: Improve Compatibility with Browser Fallbacks

Link to the challenge:

1 Like

Lets say it’s an issue and

background: var(--red-color);

doesn’t work. Then you use a fallback which is adding an extra red color background by putting in

background: red;

so then you have it there if

background: var(--red-color);

weren’t working.

Hey thanks It was helpful

I try other ways, but it was that simple. :slight_smile:

1 Like

Hey thanks It was helpful
I try other ways, but it was that simple. :

1 Like