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;

.target, new {
class: red;


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

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

  **Your browser information:**

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/ Safari/537.36

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

Link to the challenge:

You should use a class selector to target the class red

Please guide me through

the question says:
Update the .one class selector to target the new red class.

At the moment your code has erased required code, so you will need to restart the step to get it back. When you restart you will be given this code:

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

So this code targets the elements that have class=“one” correct?
But we need this code to change to target the elements that have class=“red” now.
So how would we make this change?


.red worked! thank you very much.


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