I am unable to proceed to the next step as I believe there is an error here, but I can’t seem to find it at the last
coding line - error shown by the server: Sorry, your code does not pass. Keep trying.
Your new p element should have the text Protein 3g.
Please see below the code
ioanatx20:
I am unable to proceed to the next step as I believe there is an error here, but I can’t seem to find it at the last
coding line - error shown by the server: Sorry, your code does not pass. Keep trying.
Your new p element should have the text Protein 3g.
Please see below the code
<!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>
<div class="label">
<header>
<h1 class="bold">Nutrition Facts</h1>
<div class="divider"></div>
<p>8 servings per container</p>
<p class="bold">Serving size <span>2/3 cup (55g)</span></p>
</header>
<div class="divider large"></div>
<div class="calories-info">
<div class="left-container">
<h2 class="bold small-text">Amount per serving</h2>
<p>Calories</p>
</div>
<span>230</span>
</div>
<div class="divider medium"></div>
<div class="daily-value small-text">
<p class="bold right no-divider">% Daily Value *</p>
<div class="divider"></div>
<p><span><span class="bold">Total Fat</span> 8g</span> <span class="bold">10%</span></p>
<p class="indent no-divider">Saturated Fat 1g <span class="bold">5%</span></p>
<div class="divider"></div>
<p class="indent no-divider"><span><i>Trans</i> Fat 0g</span></p>
<div class="divider"></div>
<p><span><span class="bold">Cholesterol</span> 0mg</span> <span class="bold">0%</span></p>
<p><span><span class="bold">Sodium</span> 160mg</span> <span class="bold">7%</span></p>
<p><span><span class="bold">Total Carbohydrate</span> 37g</span> <span class="bold">13%</span></p>
<p class="indent no-divider">Dietary Fiber 4g</p>
<div class="divider"></div>
<p class="indent no-divider">Total Sugars 12g</p>
<div class="divider double-indent"></div>
<p class="double-indent no-divider">Includes 10g Added Sugars <span class="bold">20%</span>
<div class="divider"></div>
</div>
<p class="daily-value small-text"><span class="bold">Protein</span> 3g</p>
<div class="divider"></div>
</div>
</body>
</html>
I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.
You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.
See this post to find the backtick on your keyboard.Note: Backticks (`) are not single quotes (').
Can you paste the link to the challenge here
This is the link - Thank you for the information above:
Learn to Code — For Free
The first part of the directions say
“After your last divider” Your code should be going after the last divider, and right now its coming before
I’ve changed the line, but still same error.
Ok, I didnt read the directions well enough. You can go back to your original code but you need to move these two lines up. That p and divider need to come before that closing div, and then you are still missing classes your second divider
The second divider needs a class to make it a large divider and your p needs a class to remove the divider. Your p element shouldnt have the daily value or small-text class, just the class to get rid of the divider
2 Likes
system
February 23, 2024, 6:35am
9
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.
