An element within an element

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
I am asked to add three div elements within a div element with a class of container. I put closing tags to each element but the code did not pass with hint saying that the new div elements should be within the first one with the class of container. So, what does it mean to have an element within another?

  **Your code so far**

/* file: index.html */
<!DOCTYPE html>
<html>
<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 class="marker">
        <div class="marker"> 
          </div>
        </div>
    </div>
  </div>
</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/103.0.5060.114 Safari/537.36 Edg/103.0.1264.49

Challenge: Step 14

Link to the challenge:

2

You are nesting them. Instead, you want them to come one after the other.

In other words, the second div should be placed below, or after, the first div and the third div should be placed below, or after the second div.

3

Thank you. I tried and have actually done it by trial and error but now I understand. The instruction did not say nest them. Thank you again.

4

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