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

Tell us what’s happening:

It keeps telling me that I should nest my new div element within the div with the class “container”, but it doesn’t work if I put two elements in the same div. It also doesn’t seem to like when I have two separate divs. What am I doing wrong?

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>

<!-- User Editable Region -->

  <body>
    <h1>CSS Color Markers</h1>
    <div class="container"> 
      </div> 
    <div class="marker">
    </div>
  </body>

<!-- User Editable Region -->

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

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36

Challenge Information:

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

I’ve been Googling div nesting, but it isn’t helping, as even with nested divs, they still have the ending that this doesn’t seem to like.

your .marker should be inside the other div
Ex:

<div class="container">
   <div  class="example">
   </div>
</div>
2 Likes

So, closing divs at the end of all divs, not at the end of their respective divs. No wonder I was confused. I’ll have to either find out why that works or devote it to memory. Thanks for your help!