Need help with this. I can’t solve this

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

Please post a link to the Step. Thanks

Just add the no-divider class to those mentioned P elements.

1 Like

Hello. Tried that. Still receiving an error.


Don’t remove the existing class; add a no-divider with them. You can set as many classes as you need.

Hi, you need to add the class no-divider to the class attribute of the same elements which hold % Daily Value * and Saturated Fat 1g. You need to add it after their existing classes in the class attribute. You have added it to some other paragraph which isn’t correct as per the instruction.

Please post your actual code instead of screenshots. Thanks

Hello. There is nothing that is working. I’m a little frustrated with this not passing. I swear this is right:

    <div class="no-divider">
      <p class="no-divider">% Daily Value *</p>
      <div class="no-divider"></div>
      <p class="no-divider"><span><span class="no-divider">Total Fat</span> 8g</span> <span class="no-divider">10%</span></p>
      <p class="no-divider">Saturated Fat 1g <span class="no-divider">5%</span></p>
    </div>

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 (').

Hey man, I am sorry but it is not working because it is not passing. If you read your errors closely, you can see the problem it is telling you exactly what it is. You removed some of the original code, rather than adding to a class list you removed some classes and it is causing an error. Fixing one does uncover another. And then another. You have three errors I believe. I will provide more information soon.

Here is the original code. For readers, we are discussing Step 48 of the Nutrition Label Project of Responsive Web Design.

    <div class="daily-value small-text">
      <p class="bold right">% 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">Saturated Fat 1g <span class="bold">5%</span></p>
    </div>

Below is the code that you have provided. Please read the error message closely.

Observe the second sentence of the error message below.

  1. Your p element with the text % Daily Value * should have no-divider added to the class attribute. Do not remove the existing classes.
  • Compare the original code and find the p element with the text % Daily Value * and add the classes that are in the original code but not yours.
  1. Doing this correctly will yield the same error.
  • You need to return the classes missing from the other <p> elements as well.
  • Pay attention the the class names as they are each different.
  1. Even after fixing this the code will not pass. This is because in your snippet of code you have removed the existing class list of daily-value and small-text and added no-divider. If you restore the parent <div> to it’s original class list it should pass after that. If you do this step first the errors will be more accurate.

Tip: It is often very useful to simply reset a lesson if you hit a wall because often times we make a mistake like this. Restoring to the original code to have a fresh take on the steps asked. Remember to follow directions step by step.

Ok. Thanks everyone for being patient with me.

Please do not remove the existing classes. Append a space followed by the no-divider class to the existing classes of the paragraphs.