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

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

  **Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html lang="en">
  <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">
  <h1>CSS Color Markers</h1>
  <div class="container">
    <div class="marker red">
    <div class="marker two">
    <div class="marker three">
/* 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;

one {
class: rgb(255, 0, 0);

.two {
background-color: rgb(0, 0, 0);

.three {
background-color: rgb(0, 0, 0);

  **Your browser information:**

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

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

Link to the challenge:

how do I make the class selector in one target red?

You are missing the full stop in front of your class selector. And the css is formatted incorrectly.

one {
class: rgb(255, 0, 0);

To target two or more classes at once, format it like this.

.cat, .ginger {
background-color: orange;

Put a comma after the first class, think of it like writing a list almost.

I tried that in the first but I got a hint saying that it should no longer be .one

this is what I’ve tried out but I’m still getting it wrong

.one, .class {
  background-color: red;

The class you need to target is ‘red’. Not ‘class’.

It might help to read this w3schools page on css classes.

thanks for the link…and your statement about what to target was of a lot of help as well. thank you

1 Like

No problem, happy to help!