Technical Documentation Page - Build a Technical Documentation Page

Tell us what’s happening:
Describe your issue in detail here.
Each .nav-link should have text that corresponds to the header text of its related section. i see it’s not working in the nav-link part?

  **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>
    <p></p>
    <p></p>
    <ul>
      <li></li>
      <li></li>
    </ul>
</section>
<section class="main-section" id="what_you_should_already_know">
  <header>What you should already know</header>
    <p></p>
    <ul>
      <li></li>
      <li></li>
      <li><li>
    </ul>
</section>
<section class="main-section" id="javascript_and_java">
  <header>Javascript and Java</header>
    <p></p>
    <p></p>
    <p></p>
</section>

<section class="main-section" id="hello_world">
  <header>Hello world</header>
  <p></p>
  <p></p>
</section>
<section class="main-section" id="variables">
  <header>Variables</header>
  <p></p>
  <p></p>
  <p></p>
</section>
<section class="main-section" id="declaring_variables">
  <header>Declaring variables</header>
  <p></p>
  <p></p>
  <code></code>
  <p></p>
  <p></p>
  <code></code>
  <p></p>
  <p></p>
  <code></code>
  <p></p>
</section>
<section class="main-section" id="variable_scope">
  <header>Variable scope</header>
  <p></p>
  <p></p>
  <code></code>
  <p></p>
  <code></code>
</section>
<nav id="navbar">
  <header>JS Documentation</header>
  <ul>
    <li>
      <a class="nav-link" href="introduction">Introduction</a>
    </li>
    <li>
      <a class="nav-link" href="what_you_should_already_know">What you should already know</a>
    </li>
    <li>
      <a class="nav-link" href="javascript_and_java">Javascript and Java</a>
    </li>
    <li>
      <a class="nav-link" href="hello_world">Hello World</a>
    </li>
    <li>
      <a class="nav-link" href="variables">Variables</a>
    </li>
    <li>
      <a class="nav-link" href="declaring_variables">Declaring variables</a>
    </li>
    <li>
      <a class="nav-link" href="variable_scope">Variable scope</a>
    </li>
  </ul>
</nav>
</main>
/* file: styles.css */
@media(max-width: 1199px) and (min-width: 769px) {

}
  **Your browser information:**

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

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

are you sure that’s how you target an id?

I change it but it still doesn’t work.

I look the navbar , ican’t see where the mistake is.

please post your updated code

<li>
        <a class="nav-link" href="#">Javascript and Java</a>
</li>

i do it this way same issue.

Tell us what’s happening:
Describe your issue in detail here.
the is in the navbar , and the nav-links.

they not working

  **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>
    <p></p>
    <p></p>
    <ul>
      <li></li>
      <li></li>
    </ul>
</section>
<section class="main-section" id="what_you_should_already_know">
  <header>What you should already know</header>
    <p></p>
    <ul>
      <li></li>
      <li></li>
      <li><li>
    </ul>
</section>
<section class="main-section" id="javascript_and_java">
  <header>Javascript and Java</header>
    <p></p>
    <p></p>
    <p></p>
</section>

<section class="main-section" id="hello_world">
  <header>Hello world</header>
  <p></p>
  <p></p>
</section>
<section class="main-section" id="variables">
  <header>Variables</header>
  <p></p>
  <p></p>
  <p></p>
</section>
<section class="main-section" id="declaring_variables">
  <header>Declaring variables</header>
  <p></p>
  <p></p>
  <code></code>
  <p></p>
  <p></p>
  <code></code>
  <p></p>
  <p></p>
  <code></code>
  <p></p>
</section>
<section class="main-section" id="variable_scope">
  <header>Variable scope</header>
  <p></p>
  <p></p>
  <code></code>
  <p></p>
  <code></code>
</section>
<nav id="navbar">
  <header>JS Documentation</header>
  <ul>
    <li>
      <a class="nav-link" href="#">Introduction</a>
    </li>
    <li>
      <a class="nav-link" href="#">What you should already know</a>
    </li>
    <li>
      <a class="nav-link" href="#">Javascript and Java</a>
    </li>
    <li>
      <a class="nav-link" href="#">Hello world</a>
    </li>
    <li>
      <a class="nav-link" href="#">Variables</a>
    </li>
    <li>
      <a class="nav-link" href="#">Declaring variables</a>
    </li>
    <li>
      <a class="nav-link" href="#">Variable scope</a>
    </li>
  </ul>
</nav>
</main>
/* file: styles.css */
@media(max-width: 1199px) and (min-width: 769px) {

}
  **Your browser information:**

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

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

now these are dead links
how do you create an internal link?

thank you a lot.
i do it like that:<a class="nav-link" href="#variable_scope">Variable scope</a>

now it’s work

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 (').

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.