The Hint for Challenge 67 is Not Working (Basic CSS: Improve Compatibility with Browser Fallbacks)

When I try to click on the button, it gives me an error 404 message. Which is really frustrating because I’m not sure what I’m supposed to do in order to get past it. Please help when you get the chance. Thank you.

1 Like

Can you share your code? make sure you format it in the editor.

It says to make a fallback immediately before the background, but it doesn’t register when I try to do it.

; :root { –red-color: red; } .red-box { background var(–red-color: red); background: var(–red-color); height: 200px; width:200px; } ;

</;div class=“red-box”<lt;/>;

Browser fallbacks are when you provide css that works on all browsers (including old ones) first, and then write css using newer or less supported css styles or syntax. Since browsers just ignore css that they don’t recognize, in old browsers it’ll just render the css it recognizes, and in new browsers the fallbacks will be overwritten by the newer css/syntax on the end.

So in this case, some older browser might not be able to use css variables. For these browsers if you set the color directly first, and afterwards set it with the variable, it’ll work in both old and new browsers.

In the example you provided, you tried to set background var(--red-color: red); which is just not correct syntax in any browser. Instead of that line, you’ll want to set the background to red directly.

1 Like

The 404 has been mentioned a couple of times today.
The error was reported in 404 Error Reported

This problem has also been mentioned with hints/help given in Help Improve Compatibility with Browser Fallbacks and About the HTML-CSS category (though the first link is easier to see the help)

A lot of times the user community will ask what you’ve done and then use your response to help you get to the correct solution without explicitly telling you what to do since the lesson kind of walks you through it. The sample that you need to fill in has an area where you need to fill in your answer and they give you a hint as to how to fill it in.

All right, I got it solved. Thank you all very much for your help. : )

2 Likes

You’re very welcome.

@mcaubrey how do you set background to red directly?
mycode:

:root { --red-color: red; } .red-box { background: red; background: var(--red-color); height: 200px; width:200px; }

@JasonHill
Mind posting your resolution code?
I have gotten the “404 page not found error” as well.

I’m long past that challenge. I don’t remember how I got past it or how I can go back. Sorry. I’ll see if I can go back and find it.

I found the challenge, but it doesn’t let me see my answer. it just allows me to do it again.