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

HTML-CSS
1

Tell us what’s happening:

Hi I am having issues, I don’t understand how I am able to put all these div elements into one;

<div class="marker"
<div class="marker"

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 class="marker"</div>
      <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/110.0.0.0 Safari/537.36 Edg/110.0.1587.69

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

Link to the challenge:

2

I would restart the step to get the original HTML back. You already added one div with the class marker inside of the .container div. You want to add two more below the one you already added.

Actually, what you did looks like it will work as long as you end your tags correctly. A tag always begins with < and ends with >. Do the opening div tags you added have both?

3

Thanks for the reply!

What I dont understand is when it says this

" Your new div elements should be within the div with the class container ."

New code after restarting lesson

4

You are getting that hint because you didn’t create the opening div tags correctly, so the tests don’t think you have added them. Fix the problem with those tags and then it will pass.

This needs to be fixed.

5

Would it be like this?

class="marker"

However then the ‘class’ won’t be active?

6

I don’t think I understand your question.

You have already added one div with the class marker inside the .container div.

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

You are just being asked to add two more of these inside the .container div. You actually did do that except that you didn’t finish off the opening div tags correctly. You did

<div class="marker"</div>

And I gave you the hint:

“A tag always begins with < and ends with >. Do the opening div tags you added have both?”

Did you read my hint? Do you see the problem with what you did? Do you see what is missing?

7

Yes!

I figured it out now, I guess what was confusing me was the wording of the hint, I was trying to add a div element within the div element without closing which made no sense to me.

I was able to pass the lesson, thank you so much