Learn CSS Colors by Building a Set of Colored Markers - Step 49

HTML-CSS
1

It says “In the .red CSS rule, change the background-color property to background”
I have changed it severally and it’s not working.

  **Your code so far**

/* file: index.html */
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Colored Markers</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <h1>CSS Color Markers</h1>
  <div class="container">
    <div class="marker red">
    </div>
    <div class="marker green">
    </div>
    <div class="marker blue">
    </div>
  </div>
</body>
</html>

/* file: styles.css */
h1 {
text-align: center;
}

.container {
background-color: rgb(255, 255, 255);
padding: 10px 0;
}

.marker {
width: 200px;
height: 25px;
margin: 10px auto;
}

.red {
background-color: rgb(255, 0, 0);
}

.green {
background-color: #007F00;
}

.blue {
background-color: hsl(240, 100%, 50%);
}


  **Your browser information:**

User Agent is: Mozilla/5.0 (iPhone; CPU iPhone OS 15_5 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.5 Mobile/15E148 Safari/604.1

Challenge: Learn CSS Colors by Building a Set of Colored Markers - Step 49

Link to the challenge:

2

Yeah I’m having the same problem.

3

You said you made the change, but I don’t see it in your code.

4

If you have a question about a specific challenge as it relates to your written code for that challenge, just click the Ask for Help button located on the challenge. It will create a new topic with all code you have written and include a link to the challenge also. You will still be able to ask any questions in the post before submitting it to the forum.

Thank you.

5

Hey! background and background-color are two different properties.

background-color: this property is used to specifically change the background color of an element

background: This property is much more generic than its counterpart because with its help, in addition to changing the color of an element, you can also add images as well as gradients to your background.

In this exercise, you’re supposed to use background as mentioned in the intructions.

image

Hope this helps! :smile:

6

So all we have to do is change background-color to background? If that’s the case, then that’s what I did and I’m sure others did and it still says it’s wrong. I restarted the code a couple of times and still the same. It seems like it might be a glitch on freecodecamp’s end.

7

Please open your own topic with your own code so that we can help you fix your code.

If I recall correctly, this may be one of the handful of challenges that shows that Apple has bugs with their implementation of Safari.

8

What browser are you using? If you are on Safari it has a problem with colours. Try it on Chrome and it will work.

9

Hey!

Their code has the bug that i mentioned above and all of the tests seem to pass for me when i corrected it.

As @JeremyLT mentioned, If you’re facing a similar problem, it would be a much better experience for you if you just post a new question,
If you do that, you can add the code that you’re trying to run which would make it easier for other people to help you and provide personalized feedback.

10

I figured it out, you were right it was Safari. I’m using my iPad but I just booted up my laptop and did it on Chrome and it passed. Thanks!

11

I was stuck too. This helped, Thank you

12

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.