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

HTML-CSS
1

Tell us what’s happening:

I hope this isn’t a stupid thing to ask. I have already solved this problem, I am just trying to understand how my solution worked. I’m not understanding the amount of divs to class ratio and WHY my solution worked. I was just adding divs until I passed. I’ll put in my code I used.

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

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>

<!-- User Editable Region -->

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

<!-- User Editable Region -->

  </body>
</html>

/* file: styles.css */
h1 {
  text-align: center;
}

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

Your browser information:

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

Challenge Information:

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

3

the end result of this project (which you can review by looking at the preview page on the very last step) is 3 different markers will be displayed.
So your code here is adding 2 more markers to the one already there at the start of the step.

however this is not valid HTML even if the test allowed it.

The opening tag is malformed and should be <div class="marker">

5

yes this looks okay to me. Did it work?

1 Like
6

Yes it did work. Thank you for your help. I hope it wasn’t redundant to ask. I just want to 1: understand what I’m doing and 2: make sure that I am coding correctly.

1 Like