Technical Doc page Trouble! Need help Please!

. Each element with the class of “main-section” should also have an id comprised of the innerText contained within it, with underscores in place of spaces. The id may include special characters if there are special characters in the respective innerText. (e.g. The that contains the header, “JavaScript & Java”, should have a corresponding id=“JavaScript_&_Java”).

https://codepen.io/hopefulcodegirl/pen/BaoqjMP

I am having an extremely annoying time with this particular problem. Please help! :grimacing:

Please help me! I can not continue till this problem is fixed!

The .main-section elements should contain at least 10

elements total (not each).

And what about this?

Please help!!!

Sorry, I don’t mean to be annoying.

you can always continue, you can do the challenges in any order


if you look below the failed user story there is the reason why it is failing, you could try to check that

One of the issues is that you have additional spaces in many of the headers. The other is that the last header has a different name from what should be in the id.

Okay, thank you! I’ll start working on that.

Unfortunately, I am still struggling with the problems mentioned above, I have gone through the whole code and found a few mistakes, but it still comes in saying that the following are wrong. :cold_sweat:

  1. Each section> element with the class of “main-section” should also have an id comprised of the header> innerText contained within it, with underscores in place of spaces. The id may include special characters if there are special characters in the respective header> innerText. (e.g. The section> that contains the header, “JavaScript & Java”, should have a corresponding id=“JavaScript_&_Java”).

2.The .main-section elements should contain at least 10 <p elements total (not each).

  1. Additionally, the navbar should contain link (a>) elements with the class of “nav-link”. There should be one for every element with the class “main-section”.

  2. When I click on a navbar element, the page should navigate to the corresponding section of the “main-doc” element (e.g. If I click on a “nav-link” element that contains the text “Hello world”, the page navigates to a section> element that has that id and contains the corresponding header>.

I would appreciate any help. Thank you so much!

And why won’t my navbar links go to the corresponding section of the page? I can’t figure it out.

In HTML, in order to link parts of your website, you have to give the part of the website an id. Then you can link it using that id. Ex:

<a href="#paragraph1">Paragraph 1</a>

<p id="paragraph1" >Paragraph I want to link</P>
1 Like

ohhhh! Now I feel so silly! Thank you!

Yeah! Now that part works! Thank you so much! :heart:

1 Like

But you don’t have this so that’s why the test fails.
You have;

<div class="nav-link">
  <a href="#What_is_Lorem_Ipsum?"> What is Lorem Ipsum?</a><br>
</div>

It says to do it like this;
<a class="nav-link" href="What_is_Lorem_Ipsum?"> What is Lorem Ipsum?</a>
All those divs you have are useless. Just get rid of them.

Another failing test says;

Each <section> element with the class of "main-section" should also have an id comprised of the <header> innerText contained within it, with underscores in place of spaces. The id may include special characters if there are special characters in the respective <header> innerText. (e.g. The <section> that contains the header, "JavaScript & Java", should have a corresponding id="JavaScript_&_Java").

Some "main-section" elements are missing the following ids (don't forget to replace spaces with underscores!) : LOREM_IPSUM_CODE : expected 1 to equal 0
It’s literally telling you what’s wrong here. This is what you have;
<section class="main-section" id="Lorem-Ipsum_Code">

I’m not going to go through every failing test. You need to read carefully and see what it’s looking for versus what you’re coding.

As an aside, you have a bad coding practice. Do not use <br> to force spacing. Use margin and/or padding in CSS.
And don’t use it to make paragraphs. If you want multiple paragraphs then use multiple paragraph elements.

1 Like

:grimacing: Thanks! I’ll get to work.

I’m getting there…Only three more left! :smile:

Nice one. I love your choice of colors.
The only issue is your project looks disjointed when it is in mobile view.

1 Like

How do I see it in mobile view so that I can get idea of what to do? And thank you for your feedback! :slightly_smiling_face:

You should concentrate on getting the user stories to pass. Then you can think about styling.

1 Like

You’re totally right. I’m trying to figure it out. It’s never been so tough than today though.

I keep being so sure that I got this correct, but it returns incorrect. What am I doing wrong?

Additionally, the navbar should contain link (<a) elements with the class of “nav-link”. There should be one for every element with the class “main-section”.