Learn Form Validation by Building a Calorie Counter - Step 83

Tell us what’s happening:

Your p element should have the text ${budgetCalories} Calories Budgeted .
i did it but my code is still not passing

Your code so far

const surplusOrDeficit = remainingCalories >= 0 ? ‘Surplus’ : ‘Deficit’;
output.innerHTML = `
${Math.abs(remainingCalories)} Calorie ${surplusOrDeficit}


${budgetCalories} Calories Budgeted

`;

WARNING

The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.

You will need to take an additional step here so the code you wrote presents in an easy to read format.

Please copy/paste all the editor code showing in the challenge from where you just linked.

Replace these two sentences with your copied code.
Please leave the ``` line above and the ``` line below,
because they allow your code to properly format in the post.

Your browser information:

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

Challenge Information:

Learn Form Validation by Building a Calorie Counter - Step 83

1 Like

Welcome to our community!

Where is the opening <p>, and the closing </p> tag?
Read the instructions again: " Now create a p element with the text budgetCalories Calories Budgeted…"

2 Likes

Noted. My Code has passed thanks

2 Likes

${budgetCalories}Calories Budgeted

`; } be careful with spacing, thats the issue i had
2 Likes

like DobarBREND explained, the p opening and closing tag are needed to pass this challenge, and like Zan1 said, spacing is an issue for passing the actual step in the project. This has more to do with the requirements of it’s (the project itself) requirements than it does with any real world application.

Don’t misunderstand me, spacing is important, formatting is important, but whether or not you include a space before or after a p tag will depend on how you are specifically trying to format your paragraph in the code you are writing, but for this specific project, on this specific text, the format it requires is to not have a space before or after the tag, so

<p>${budgetCalories} Calories Budgeted</p> will work, but
<p> (space) ${budgetCalories} Calories Budgeted</p> will not work.

Spaces before, or after, or a lack of a space can have subtle differences in the way that your page formats in regards to a p tag, you should experiment with them. I didn’t realize this at first, and was very confused and frustrated by not being able to understand why my perfectly placed paragraphs weren’t lining up perfectly.

But it’s also important to understand that having or not having a space before or after a p tag will not prevent you from creating or using a p tag, it’s not like <p> space "Text" </p> will produce a syntax error or anything.

cheers,
jer

1 Like