Learn Typography by Building a Nutrition Label-step 43

HTML-CSS
1 
<div class="daily-value small-text">
  <p class="bold right">% Daily Value *</p>
  <div class="divider">
    <p>
      <span>
        <span class="bold">Total Fat</span> 
          8g 
        </span>
      <span class="bold">10%</span>
      </p>
  </div>
</div>

Hello, this is my code so far. I completed the necessary steps to include, style, and format the total fat and percentage area. I believe to have successfully nested the last span element as well. What I do not understand is why it says I need a new p element underneath my daily-value class. Even when I insert one there it says the same thing. The step instructions say nothing about inserting a p element there (or maybe I just don’t understand it). Either way, I do not know what it is I am missing here

2

Instructions:
" After your last .divider element, create a p element and give it the text Total Fat 8g 10% . Wrap the text Total Fat in a span element with the class of bold . Wrap the text 10% in another span element with the class of bold . Finally, nest the Total Fat span element and the text 8g in an additional span element for alignment."

Error Message: " Hint

You should create a new p element at the end of your .daily-value element."

3

please post a link to the challenge.

from what i can see, you have nested the new p element inside a .divider element which I think was not in the instructions?

also I would not split out my p element and its spans on separate lines
We cannot tell if you have the correct spacing when they are on separate lines like this.

1 Like
4

Thank you! My issue was nesting the p element inside the .divider element, thank you for pointing it out, I did not realize I did that

1 Like