Technical Documentation Page

Tell us what’s happening:

This is the error received:-
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).

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="styles.css">
    <title>Document</title>
</head>
<body>
<nav id="navbar">
  <header>Technical Webpage@Tech Sunny</header>
  <a href="Hello_world" class="nav-link">Hello world</a>
  <a href="HTML_Structure" class="nav-link">HTML Structure</a>
  <a href="CSS_Style" class="nav-link">CSS Style</a>
  <a href="Java_Script" class="nav-link">Java Script</a>
  <a href="Responsive_Webpage" class="nav-link">Responsive Webpage</a>
</nav>
  <main id="main-doc">
<section id="Hello_world" class="main-section"><header>Hello world</header><p></p><p></p><code></code><li></li>

</section>
<section id="HTML_Structure" class="main-section"><header>HTML Structure</header><p></p><p></p><code></code><li></li>

</section>
<section id="CSS_Style" class="main-section"><header>CSS Style</header><p></p><p></p><code></code><li></li>

</section>
<section id="Java_Script" class="main-section"><header>Java Script</header><p></p><p></p><code></code><li></li>

</section>
<section id="Responsive_Webpage" class="main-section"><header>Responsive Webpage</header><p></p><p></p><code></code><li></li>

</section>
  </main>
    
</body>
</html>
/* file: styles.css */
@media{
from(width:400px)
to(width:600px)
{
background-color:cyan;
}
}

### Your browser information:

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

### Challenge Information:
Technical Documentation Page - Build a Technical Documentation Page
https://www.freecodecamp.org/learn/2022/responsive-web-design/build-a-technical-documentation-page-project/build-a-technical-documentation-page

Just a small mistake! xD

Your hrefs should include # like so:

href="#section"
2 Likes

Cracked that @your clear guidance…pls acknowledge my regards.
TechSunny

1 Like