Product landing page problem #5

cannot pass #5 on product landing page

Unfortunately my crystal ball is charging at the moment. :wink: Do you have a link to a pen or a repo or something? So we can see the code? Or were you not asking for help and just wanted to inform us that you can’t pass #5?

2 Likes
<nav id="nav-bar">
       <nav>
         <ul>
           <li><a href="index.html"class="nav-link">home</a></li>
           <li> <a href="mahem.html" class="nav-link">mahem</a></li>
           <li> <a href="price.html" class="nav-link">price</a></li>
           <li> <a href="comedy.html"class="nav-link">comedy</a></li>
         </ul> 
       </nav>

I’ve edited your post 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 (’).

Can you tell us what the failing test says?

Also, you have two opening nav tags here

i am getting trouble with the nav-links story #5

 <nav id="nav-bar">
       <nav>
         <ul>
           <li><a href="index.html"class="nav-link">home</a></li>
           <li> <a href="mahem.html" class="nav-link">mahem</a></li>
           <li> <a href="price.html" class="nav-link">price</a></li>
           <li> <a href="comedy.html"class="nav-link">comedy</a></li>
         </ul> 
       </nav>
      *emphasized text*

The issue is with these href values

When the user clicks on any of these links, they should be able to go to a section on the page.

For example, if I click the mahem link, then it should take me to a section called mahem.
Same with the price and comedy links.

Right now, you page doesn’t have any sections and your links don’t go anywhere.

You will need to refresh on this lesson called Link to Internal Sections of a Page with Anchor Elements

Hope that helps!

1 Like

The .nav-link with href=“index.html” is not linked to a corresponding element on the page : expected null to not equal null

First you have to review the lesson I sent you.
That is the lesson where FCC taught you how to link to other sections on the page.

Once you are able to review that lesson and properly link to other sections on the page then you can pass the tests and focus on cleaning up the syntax errors in your html .

But first review that lesson.

Then if you are still confused then reply back.

i know that lesson i just revieded it i am trying all kind a thing still aint getting trough

You are moving in the right direction.

The changes you made here are correct

           <li> <a href="#mahem" class="nav-link">mahem</a></li>
    <section>
       <h2 id="#mahem"></h2>
      </section>

The next step is to apply what you just did to all of the nav links.

You need to create sections for home, price and comedy and you need to change all of those href values.

make sense?

    <section>
       <h2 id="#mahem"></h2>
      </section>

I think that id should just be “mayhem” - you don’t need the CSS selector on the id.


i know that lesson i just revieded it i am trying all kind a thing still aint getting trough

This is very common. This is hard stuff, don’t get frustrated. Everyone has spots that trip them up. I had many. Just keep at it.

1 Like

I missed that earlier :grinning_face_with_smiling_eyes:

But you are close to passing the tests.

The other thing I just noticed was that you deleted the anchor tags for these links here

           <li href="index.html"class="nav-link">home</li>
           <li href="price.html" class="nav-link">price</li>
           <li href="comedy.html"class="nav-link">comedy</li>

This is the correct html structure for your navlinks

           <li> <a href="#mahem" class="nav-link">mahem</a></li>

some thing is just still not right

all your help me nah

We need to focus our attention on the nav links here

           <li> <a href="index.html"class="nav-link">home</a></li>
           <li> <a href="mahem.html" class="nav-link">mahem</a></li>
           <li> <a href="price.html" class="nav-link">price</a></li>
           <li> <a href="comedy.html"class="nav-link">comedy</a></li>

Your href values have to match the ids you created in the sections.

In order to pass the test, you need to make changes only to the href values in the navbar.

For example, instead of href="index.html" it is supposed to be href="#home"
Just like in the FCC lesson.

You need to change all of the href values to match the ids of mahem, price and comedy.

Once you make those changes, only to the nav links then the test passes.

I gave you the first answer, and now it is up to you to change the rest of the nav links.

thank you thank you all them combination i aint no how i did see it

Awesome.
Congrats on passing the tests. :grinning:

The next part is to make a post in the #project-feedback section.
The reason why you need to ask for project feedback is because there are errors in your html and css that need fixing.

The forum can help you fix these errors so you don’t keep making them in the future.

And if you want to make separate posts for your survey form and tribute page, then you can do that too.

will do i feel i getting the hang of it

Hi, You must follow this syntax below :
<a href="#id of element in the page"></a>