Help me solve "Your header element should be within your .label element"

I’ve been struggling to pass;
Step 24. Wrap everything within the .label element in a new header element.

Hint says;
Your header element should be within your .label element.

However I have no clue wrapping everything within the .label element. I tried
.label { }
which didn’t work. Will be appreciated if anyone share some ideas.

  **Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Nutrition Label</title>
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700,800" rel="stylesheet">
  <link href="./styles.css" rel="stylesheet">
</head>
<body>
<header>
  <div class="label">
    <h1 class="bold">Nutrition Facts</h1>
    <div class="divider"></div>
    <p>8 servings per container</p>
    <p class="bold">Serving size <span class="right">2/3 cup (55g)</span></p> 
    </div>
    </header> 
</body>
</html>
/* file: styles.css */
* {
box-sizing: border-box;
}

html {
font-size: 16px;
}

body {
font-family: 'Open Sans', sans-serif;
}

.label {
border: 2px solid black;
width: 270px;
margin: 20px auto;
padding: 0 7px;
}

h1 {
text-align: center;
margin: -4px 0;
letter-spacing: 0.15px
}

p {
margin: 0;
}

.divider {
border-bottom: 1px solid #888989;
margin: 2px 0;
}

.bold {
font-weight: 800;
}

.right {
float: right;
}
  **Your browser information:**

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

Challenge: Step 24

Link to the challenge:

1 Like

Hi @yutoto ,

You are close. You are nesting everything within the header.

You should nest everything within the .label element in the header, and then nest the header within the div with the class label.

5 Likes

Hi @spark07 ,
Thank you so much for your gread advice! My code passes. It’s kind of difficult to figure out where to nest appropriately. I need to work on that more. Thanks again for your time. Much appreciated.

2 Likes

First you have to nest everything in the label tag then after the div with the label tag create the header and nest again until before the closing div tag;

Nutrition Facts

8 servings per container

Serving size 2/3 cup (55g)