Technical Documentation Page - Build a Technical Documentation Page

[adnan1]

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

Your code so far

<!-- file: index.html -->
<main id="main-doc">

  <link rel='stylesheet' href="styles.css">

  <nav id='navbar'>

    <header>Topic</header>

<a class="nav-link" href='#filler_text'>Filler Text 1</a>

     <a class="nav-link" href='#filler_text'>Filler Text 2</a>

    <a class="nav-link" href='#filler_text'>Filler Text 3</a>

     <a class="nav-link" href='#filler_text'>Filler Text 4</a>

     <a class="nav-link" href='#filler_text'>Filler Text 5</a>

  </nav>

  <section class="main-section" id="filler_text_1">

    <header>Filler Text 1</header>

    <p>This is paragraph 1.</p>
    <p>This is paragraph 2.</p>

    <code></code>
    <ul>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
    </ul>
  </section>
  
  <section class="main-section" id="filler_text_2">

    <header>Filler Text 2</header>

    <p>This is paragraph 3.</p>
    <p>This is paragraph 4.</p>
    <code></code>
  </section>

  <section class="main-section" id="filler_text_3">

    <header>Filler Text 3</header>

    <p>This is paragraph 5.</p>
    <p>This is paragraph 6.</p>
    <code></code>
  </section>

  <section class="main-section" id="filler_text_4">

    <header>Filler Text 4</header>

    <p>This is paragraph 7.</p>
    <p>This is paragraph 8.</p>
    <code></code>
  </section>

 <section class="main-section" id="filler_text_5">

    <header>Filler Text 5</header>

    <p>This is paragraph 3.</p>
    <p>This is paragraph 4.</p>
    <code></code>
  </section>

</main>

/* file: styles.css */
#navbar {
  position: fixed;
  left: 0;
  padding: 20px;
}

#navbar header {
  font-size: 1.618em;
  margin-bottom: 7;

}

#navbar a {
  text-decoration: none;
  display: block;
  margin-bottom: 12px;

}

#main-doc {
  margin-left: 200px;
}

@media (max-height: 600px;) {
  .main-section{
    font-size .7em;
  }

}

Your browser information:

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

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

freeCodeCamp.org

[anon42932716]

Hello!
The nav-links should include the numbers that are included in the text.

This is not the solution: It is an example.

For example: ```
< a class=“nav-link” href=‘#apples_a_9’>Apples A 9< /a>

Make sure to include the numbers in the page links, too. 

Happy coding! :)