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

HTML-CSS
1

Tell us what’s happening:
help me

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">

<!-- User Editable Region -->

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

<!-- User Editable Region -->

    </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/115.0.0.0 Safari/537.36

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

Link to the challenge:

2

Look again at the example of how to add multiple classes to an element:

<div class="animal dog">

This adds both the animal and dog class to the div. Do you have any questions about that?

You need to do the same thing when you add the class one to the first div that already has the class marker.

Only change the first marker div. Do not make any other changes.

1 Like