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"

HTML-CSS
1 
<nav id="navbar">
                <header id="header-contents"style="color:white;"><u>Web site Functional Specification</u></header>
                <ul>
                    <a class="nav-link" href="#Overview"><li>Overview</li></a>
                    <a class="nav-link" href="#Goals_and_Criteria"><li>Goals and Criteria</li></a>
                    <a class="nav-link" href="#Hardware"><li>Hardware</li></a>
                    <a class="nav-link" href="#Operating_System"><li>Operating System</li></a>
                    <a class="nav-link" href="#System_Software"><li>System Software</li></a>
                    <a class="nav-link" href="#Statistical_Data"><li>Statistical Data</li></a>
                    <a class="nav-link" href="#Network"><li>Network</li></a>
                    <a class="nav-link" href="#Navigation"><li>Navigation</li></a>
                    <a class="nav-link" href="#Content"><li>Content</li></a>
                    <a class="nav-link" href="#Themes"><li>Themes</li></a>
                    <a class="nav-link" href="#Logo"><li>Logo</li></a>
                    <a class="nav-link" href="#Site_Management"><li>Site Management</a>
                    <a class="nav-link" href="#Definition"><li>Definitions</li></a>
                </ul>
            </nav>

Cannot pass the test. What seems to be the mistakes>

2

Would you mind adding the link to the task?
From your description I am not sure what you mean, so this would clarify things :slight_smile:

1 Like
3

I guess the list structure would be like ul > li with anchor elements placed, it would be ul > li > a
And also try removing the header and replace it with heading tags like h1 to h6

4

okay, I did what like what youve suggested.

<ul>
                 <li><a class="nav-link" href="#Overview">Overview</a></li>
                  <li><a class="nav-link" href="#Goals_and_Criteria">Goals and Criteria</a></li>
                  <li><a class="nav-link" href="#Hardware">Hardware</a>
                  <li><a class="nav-link" href="#Operating_System">Operating System</a></li>
                  <li><a class="nav-link" href="#System_Software">System Software</a></li>
                  <li><a class="nav-link" href="#Statistical_Data">Statistical Data</a></li>
                  <li><a class="nav-link" href="#Network">Network</a></li>

Now Im getting this error: Each element with the class of “nav-link” should contain text that corresponds to the text within each (e.g. if you have a “Hello world” section/header, your navbar should have an element which contains the text “Hello world”).

5

Okay brother, i just gave a suggestion, but it would be easy if you provide a codepen to your project to find out the problem

6

here’s the link:

7

It wants this id to be nav-bar

And the <nav> element should be inside <header>, it will clear you half way through almost

8

The problem still persist after making changes to the code.

12. Each element with the class of "nav-link" should contain text that corresponds to the <header> text within each <section> (e.g. if you have a "Hello world" section/header, your navbar should have an element which contains the text "Hello world").
1 Like
9

Have you updated the codepen.?, so i shall check it

1 Like
10

Yes, I’ve updated it, and I’ve written exactly like the one gave us as a model. But still the test error persist

11

You haven’t made this change which i said earlier

When i did the change, the error is removed,

Screenshot%20from%202018-08-17%2003-12-22
Screenshot%20from%202018-08-17%2003-12-221366Ă—768 156 KB

Your design may break a little, so adjust it after you make these changes,

  1. nav should be inside <header></header> and give id=“header” to header, currently you have id as header-contents, so change it, and replace the id=“navbar” to nav-bar
1 Like
12

If I change the <nav id=“nav-bar”, my test failed increases,

nav-bar
nav-bar1287Ă—398 54.9 KB

but if I changed it to id=“navbar”, there is only one test failed.

navbar
navbar1285Ă—438 51 KB

13

You are almost there, it says the link should correspond to the header, i checked it, and found a typo there,
In your last nav-link, you have the text as Definitions but in you header element you have Definition
Now it’s passing 16/16, good luck.!

1 Like
14

I gotta say that 100% of the times i get stuck, is because of “-” or similar.
Regarding this exercise i spent 40m to see that i wrote “navbar” instead of “nav-bar”.

3 Likes
15

I can’t pass content 10, pls i need your help

16

Hi @Aliiu!

Welcome to the forum!

Since this is an older post from two years ago I would suggest opening up a new topic and asking your question there.

Thank you.