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

Curriculum Help
1

Tell us what’s happening:

Describe your issue in detail here. Can i pls get help with this code. I am confused on what to do.

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;
}


/* User Editable Region */

.red {
  background: rgb(255, 0, 0);linear-gradient(90deg, #FF0000, #00FF00);
}

/* User Editable Region */


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

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

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36

Challenge Information:

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

2

You appear to have created this post without editing the template. Please edit your post to Tell us what’s happening in your own words.
Learning to describe problems is hard, but it is an important part of learning how to code.
Also, the more you say, the more we can help!

3

HI!! @leegallet :blush:

you have to just set the “linear-gradient()” with a value of “90deg” and clear “rgb(255, 0, 0)”.

Happy coding :smile:

4

Hello!

Good attempt!

Here is the example for this step.

linear-gradient(gradientDirection, color1, color2, ...);

We are asked to enter a 90deg gradientDirection, which you did correctly.

But only the rgb color is to be entered.

Hope this helps.

5

thank you so much for them help :heart:

6

It’s a pleasure to help, and happy new year :blush:

7

im still getting it wrong, i dont know why

8

you just have to put “linear-gradient()” with a
value “90deg” replacing “rgb(255, 0, 0)” from your code.

9

.red {
background linear-gradientrgb 90deg: rag (255, 0, 0); like this
} do you mean to do it like this? :thinking:

10

only “linear-gradient()” with a value of “90deg”

11

must be like this …

.red {
background: linear-gradient(90deg, #FF0000, #00FF00);
}

12

so like this .red {
background:linear-gradient(90deg, #FF0000, #00FF00);
} ?the rgb(255, 0, 0); should be removed?

13

i did exactly that and its still wrong :smiling_face_with_tear:

14

Yes, only without the “#FF0000, #00FF00”

15

Apologies, you must add spacing between your values.

16

ok so like this

    .red {
background:linear-gradient (90deg );
}

?

17

yes, it’s like that :upside_down_face:

19

thank you for helping me :heart:

20

it’s a pleasure to help :purple_heart: