I need to switch from background-color to background

Tell us what’s happening:
Describe your issue in detail here.

  **Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Colored Markers</title>
  <link rel="stylesheet" type="text/css" 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: rgb(255, 0, 0);
}

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

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

  **Your browser information:**

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Safari/605.1.15

Challenge: Step 49

Link to the challenge:

Hello there.

Do you have a question?

If so, please edit your post to include it in the Tell us what’s happening section.

Learning to describe problems is hard, but it is an important part of learning how to code.

Also, the more information you give us, the more likely we are to be able to help.

I need to switch from background color to background in CSS, Im not sure how else to ask

Ive noticed sometimes there is a delay even when I have the correct answer. At this point, Im guessing any combination of answers and ultimately end up forgetting what I was supposed to learn from the challenge in the first place.

I’m not sure what you mean by “switch from background color to background in CSS”.

If you currently have a style that uses background-color and you want to use background instead, then delete the background-color line and add the background property.

Here is some documentation on how the background property works: background - CSS: Cascading Style Sheets | MDN

Tell us what’s happening:
Describe your issue in detail here.

These are the instructions…
You’ve learned a few ways to set flat colors in CSS, but you can also use a color transition, or gradient, on an element.

A gradient is when one color transitions into another. The CSS linear-gradient function lets you control the direction of the transition along a line, and which colors are used.

One thing to remember is that the linear-gradient function actually creates an image element, and is usually paired with the backgroundproperty which can accept an image as a value.

In the .red CSS rule, change the background-color property to background.

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

I changed to…

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

What am I missing?
Your code so far

/* file: index.html */
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Colored Markers</title>
  <link rel="stylesheet" type="text/css" 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: rgb(255, 0, 0);
}

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

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

  **Your browser information:**

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Safari/605.1.15

Challenge: Step 49

Link to the challenge:

Thank you for your time.

I still dont know what to do

Are you using Safari? It seems like a recent update to Safari has been causing problems with some of the CSS challenges.

Yes, Im so frustrated. Ive been stuck here for 4days

Try using a different browser for now.

1 Like

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