Technical Documentation Page - Build a Technical Documentation Page

[tosinakinrele]

hey guys i need help i think i got it all in the wrong order.
thanks

Failed:All of your .nav-link elements should be in the #navbar.*
Failed: Each .nav-link should have an href attribute that links to its corresponding .main-section (e.g. If you click on a .nav-link element that contains the text “Hello world”, the page navigates to a section element with that id).

Failed: Your Technical Documentation project should use at least one media query.

Tell us what’s happening:*
Describe your issue in detail here.

Your code so far

<!-- file: index.html -->


<link rel="stylesheet" href="styles.css">
<main id="main-doc">
  <section class="main-section" id="Introduction">
    <header>Introduction</header>
    <nav id="navbar">
      <header><a class="nav-link" href="Introduction">Introduction</a></header>
    </nav>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
     <code></code>
    <code></code>
    <code></code>
    <code></code>
    <code></code>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
  </section>
  <section class="main-section" id="What_you_should_already_know">
    <header>
    <a class="nav-link" href="What you should already know">What you should already know</a>
    </header>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
     <code></code>
    <code></code>
    <code></code>
    <code></code>
    <code></code>
     <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
  </section>
  <section class="main-section" id="JavaScript_and_Java">
    <header><a class="nav-link" href="JavaScript and Java">JavaScript and Java</a></header>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
     <code></code>
    <code></code>
    <code></code>
    <code></code>
    <code></code>
     <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
  </section>
 <section class="main-section" id="Hello_world">
   <header><a class="nav-link" href="Hello World">Hello world</a></header>
   <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <code></code>
    <code></code>
    <code></code>
    <code></code>
    <code></code>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
 </section>
  <section class="main-section" id="variables">
   <header><a class="nav-link" href="Variables">Variables</a></header>
   <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <code></code>
    <code></code>
    <code></code>
    <code></code>
    <code></code>
     <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
  </section>
</main>

/* file: styles.css */

Your browser information:

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

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

freeCodeCamp.org

[hbar1st]

you have to attempt to follow the html rules you learned in the curriculum.

For eg. the link element belongs in a head element
The navbar needs internal links inside (you use “#Introduction” for the href for eg to link to an internal id on the page)

Anchor tags need proper links inside their href, not text.

You need to add missing elements to your navbar to link to each section you have created.