Technical Documentation Page - Build a Technical Documentation Page

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

Hello, I am trying to understand why I am not passing the final few steps which are:
-The first child of each .main-section should be a header element.
-Each .main-section should have an id that matches the text of its first child, having any spaces in the child’s text replaced with underscores (_ ) for the id’s.
-Each .nav-link should have text that corresponds to the header text of its related section (e.g. if you have a “Hello world” section/header, your #navbar should have a .nav-link which has the text “Hello world”).
-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).

I have been trying to figure these steps out for the past few days and cant figure it out. Any hints or help would be greatly appreciated!

  **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">
</head>
<main>
   <title>Technical Documentation Page</title>
   <main id="main-doc">
     <section class="main-section" id="Technical_Drums"></section>         
     <header>
       <h5>Technical Drums</h5>
       </header>      

    <section class="main-section" id="Percussion_Types">
      <header>
        <h5>Percussion Types</h5>
        </header>
    <p></p>
    <p></p>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
      </section>
      <section class="main-section" id="Drum_Types">
        <header>
          <h5>Drum Types</h5>
          </header>
      <p></p>
      <p></p>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
        </section>
        <section class="main-section" id="Drum_Line">
          <header>
            <h5>Drum Line</h5>
            </header>
        <p></p>
        <p></p>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
          </section>
          <section class="main-section" id="Drum_Sticks">
            <header>
              <h5>Drum Sticks</h5>
              </header>
          <p></p>
          <p></p>
          <li></li>
          <li></li>
          <li></li>
          <li></li>
          <li></li>
            </section>
            <section class="main-section" id="Drum_Set<">
              <header>
                <h5>Drum Set</h5>
                </header>
            <p></p>
            <p></p>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <code></code>
            <code></code>
            <code></code>
            <code></code>
            <code></code>
              </section>
              
              
              
              
<nav id="navbar">
<br>
               <header>Drum Documentation</header>
               <a class="nav-link" href="Technical_Drums">Technical Drums</a>
               <br>
     <a class="nav-link" href="Percussion_Types">Percussion Types</a>           
     <a class="nav-link" href="Drum_Types">Drum Types</a>
      <a class="nav-link" href="Drum_Line">Drum Line</a>
      <a class="nav-link" href="Drum_Sticks">Drum Sticks</a>
      <a class="nav-link" href="Drum_Set">Drum Set</a>
           </nav>    
    </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/104.0.5112.102 Safari/537.36 Edg/104.0.1293.70

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

where is the content of this section element?

What is posted is what I currently have so far.

I made an edit and was able to fix that part. I had the closing section element in the wrong area.
< section class=“main-section” id=“Technical_Drums”>
< header>
< h5>Technical Drums
< /header>
< /section>

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