Learn Typography by Building a Nutrition Label - Step 43

[Roi24]

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.

Hint!
One span element should wrap the text Total Fat .

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

[Guided]

If you attempt a step thee times a ‘help’ button will appear:

Using the help button will create a post with all your code so far, a link to the step your on and can be edited to include your question

Looking at your code, you should only have to write the text ‘Total Fat 8g 10%’ once.

Here is an example of using spans in text:
(this is an example not the answer)
<p>This is some example text</p>

I can surround the text ‘example’ with a span element
<p>This is some <span>example<span> text</p>

If I give the span a class or id, I will be able to change the look of the text ‘example’ without changing the rest of the paragraph element