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

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

  **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">
    </div>
    <div class="marker">
    </div>
    <div class="marker">
    </div>
  </div>
</body>
</html>
/* file: styles.css */
h1 {
text-align: center;
}

.marker {
width: 200px;
height: 25px;
background-color: red;
margin: 10px auto;
}

  **Your browser information:**

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

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

Link to the challenge:

I don’t understand , don’t know how to do this?

Ya, the instructions on this could definitely be a little clearer (it is being worked on). The example code at the bottom of the instructions is showing you how to add multiple class names to an element. You use the same class attribute and you add them to the value by separating them with a space. So if we wanted to add two class names to the same div, the first class name being “red” and the second class name being “green”, then it would be:

<div class="red green">

In this step, the first div looks like:

<div class="marker">

So you already have one class name for that div and you want to add a second one called one. Based on what I told you above, how would you do that?

2 Likes

yeah I understand now , thank you so much. :grin: :+1: