Links don't work can someone tell me why

HTML-CSS
1 
<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Technical Documentation</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="styles.css">
  </head>
   <body>
     <nav id="navbar">
     <header>Navigation</header> 
<ul>
 <li><a class="nav-link" href="JavaScript_and_Java">JavaScript and Java</a></li>
 <li><a class="nav-link" href="Topic_2">Topic 2</a></li>
 <li><a class="nav-link" href="Topic_3">Topic 3</a></li>
   <li><a class="nav-link" href="Topic_4">Topic 4</a></li>
  <li><a class="nav-link" href="Topic_5">Topic 5</a></li>
  </ul>
</nav>
<hr>
<main id="main-doc">
     <section class="main-section" id="JavaScript_and_Java">
         <header>JavaScript and Java</header>
       <h2>JavaScript and Java</h2>

  <ul>
     <li><p>JavaScript and Java info</p></li>
    <li><p>JavaScript and Java more info<p><li>
 <li><code>JavaScript and Java code example</code></li>
 </ul>
     </section>
<hr>
<section class="main-section" id="Topic_2">
  
  <header>Topic 2</header>
  <h2>Topic 2</h2>
 <ul>
        <li><p>topic 2 info</p></li>
   <li>
      <p>topic 2 more info</p></li>
    <li><code>topic 2 code example</code></li>
   </ul>
          </section>
          <hr>
<section class="main-section" id="Topic_3">
  
   <header>Topic 3</header>
   <h2>Topic 3</h2>
      <ul>  <li>
       <p>topic 3 info</p></li>
            <li> <p>topic 3 more info</p></li>
   <li><code>topic 3 code example</code></li>
      </ul>
       </section>
       <hr>
   <section class="main-section" id="Topic_4">
   
   <header>Topic 4</header>
     <h2>Topic 4</h2>
   <ul>
        <li><p>topic 4 info</p></li>
     <li><p>topic 4 more info</p></li>
   <li><code>topic 4 code example</code> </li>
    </ul>
          </section>
<hr>
    <section class="main-section" id="Topic_5">
      
      <header>Topic 5</header>
      <h2>Topic 5</h2>
      <ul>
        <li> <p>topic 5 info</p></li>     
        <li><p>topic 5 more info</p></li>
       <li>
      <code>topic 5 code example</code></li>
      </ul>>
       </section>
      </main>
    </body>
</html>
2

I’ve edited your code 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.

Pre-formatted-text
Pre-formatted-text1356Ă—380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

1 Like
3

when you use an id to select an element, you need to use # in front

1 Like
4

Thank you, sorry about the mess.

1 Like
5

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