Improve Compatibility with Browser Fallbacks -

HTML-CSS
1

Tell us what’s happening:

Task - Your .red-box rule should include a fallback with the background set to red immediately before the existing background declaration.

How to do this???

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>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:62.0) Gecko/20100101 Firefox/62.0.

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

2

Add div{
background: red;
Hope this helps.

3

Hey Macy , thanks for reply… but still i dint solve that error

can you please explain me in brief or by coding…??
thanks…

1 Like
4

Hi there juhijain123, i had the same problem. Carefully read the instructions before you try it:

Your .red-box rule should include a fallback with the background set to red immediately before the existing background declaration.

When you put it like this: “background: var(–red-color, red);” you are not reading the instructions. It says before the existing background declaration. So the answer will be:

background: red;
background: var(–red-color);

Try again!

1 Like
5

Hi again, juhijain123. alexandergranasen already explained it. :grinning:

1 Like
6

Thank you for your reply. I Googled this and got that it was supposed to be

background-color: red;

7

Good, but do you understand why?

8

You are most welcome zister!
“background-color: red” does not work for me as a solution, “background: red” is what works in the exercise.

9

am also having the same issue please how do you solve it ?

10

Read above my friend :).

11

Thanks Alex and the community. Its great to learn with so much support.:heart_eyes:

1 Like
12

This worked:
background: red;
background: var(–red-color);

13

hi man
thanks for your guidance, I am glad for founding this community because it is so useful for learning programming.
again thanks

14

thanks alot! this helped me out alot. i couldnt figure out what to put there.