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

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
Hello everyone, please can someone help me with this problem.
I was given this instruction:

To give the markers different colors, you will need to add a unique class to each one. Multiple classes can be added to an element by listing them in the class attribute and separating them with a space. For example, the following adds both the animal and dog classes to a div element.

<div class="animal dog">

To begin, add the class one to the first marker div element.

but i don’t understand what it want me 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">
    </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 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Safari/537.36

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

Link to the challenge:

2

Hi!

The first step is to identify the first marker div element.

<div class="container">
    <div class="marker"><!—this one—>
    </div>
    <div class="marker">
    </div>
    <div class="marker">
    </div>
  </div>

I’ve indicated it using a html comment.

Next you need to add the class one to that div. So in the example, this is what a div with two classes looks like. (Closing tag is omitted in the example on the lesson, but you do need it.

So to give this div two classes, two words have been used. The word animal and the word dog.

<div class="animal dog"></div>

So to add class one to the marker div, you need to type out the word one inside the quote marks.

<div class="marker">
    </div>

Hope that helps!

2 Likes
3

Yes it does thanks :upside_down_face:

1 Like
4 
[Removed by Moderators]
1 Like
5

Hey! Instead of providing answers to questions, it would be much better for someone’s learning experience if you just provide them with enough hints and suggestions to help them get through the problem.

We are trying to minimize the number of solutions on the site to help the community members get better at reasoning through and solving potential roadblocks.

1 Like
6

oh okay. Thanks for your suggestion.

7

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