Basic CSS: Improve Compatibility with Browser Fallback

HTML-CSS
1

Tell us what’s happening:
Well the lesson for this is not really telling me what to do

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 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.1.2 Safari/605.1.15.

Challenge: Improve Compatibility with Browser Fallbacks

Link to the challenge:

2

Hey @Skull! In this lesson you have to:

It looks like a variable is being used to set the background color of the .red-box class. Let’s improve our browser compatibility by adding another background declaration right before the existing declaration and set its value to red.

Which means if the website fails to set the red box to the color red, you should add a background declaration (a fallback) to improve the compatibility of the browser.

Now you have to add a second background: ; property that is set to red - to your .red-box class - instead of the variable.

I hope this helped :smiley:.

3

Thank you very much for the help it really seemed to help me hop you have a good night

1 Like
4

Have a good night too @Skull! :smiley: