Technical Documentation Page - Build a Technical Documentation Page

Tell us what’s happening:
The error is :
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.

idk why is it still wrong tho, i

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>
  <body>
    <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="#Variables_Scope">Variables Scope</a>
        </li>
        <li>
          <a class="nav-link" href="#Global_Variables">Global Variables</a>
        </li>
        <li>
          <a class="nav-link" href="#Constants">Constants</a>
        </li>
        <li>
          <a class="nav-link" href="#Data_Types">Data Types</a>
        </li>
        <li>
          <a class="nav-link" href="#If...else statement">If...else statement</a>
        </li>
        <li>
          <a class="nav-link" href="#While_Statement">While Statement</a>
        </li>
        <li>
          <a class="nav-link" href="#Function_Declarations">Function Declarations</a>
        </li>
        <li>
          <a class="nav-link" href="#Reference">Reference</a>
        </li>
      </ul>
    </nav>
    <main id="main-doc">
      <section class="main-section" id="Introduction">
        <header><h2>Introduction</h2></header>
      </section>
      <section class="main-section" id="What_you_should_already_know"></section>>
        <header><h2>What you should already know</h2></header>
      </section> 
      <section class="main-section" id="JavaScript_and_Java">
        <header><h2>JavaScript and Java</h2></header>
      </section>
      <section class="main-section" id="Hello_World">
        <header><h2>Hello World</h2></header>
      </section>
      <section class="main-section" id="Variables">
        <header><h2>Variables</h2></header>
      </section>
      <section class="main-section" id="Declaring_Variables">
        <header><h2>Declaring Variables</h2></header> 
      </section>
      <section class="main-section" id="Variables_Scope">
        <header><h2>Variables Scope</h2></header>
      </section>
      <section class="main-section" id="Global_Variables">
        <header><h2>Global Variables</h2></header>
      </section>
      <section class="main-section" id="Constants">
        <header><h2>Constants</h2></header>
      </section>
      <section class="main-section" id="Data_Types">
        <header><h2>Data Types</h2></header>
      </section>
      <section class="main-section" id="If...else statement">
        <header><h2>If...else statement</h2></header>
      </section>
      <section class="main-section" id="While_Statement">
        <header><h2>While Statement</h2></header>
      </section>
      <section class="main-section" id="Function_Declarations">
        <header><h2>Function Declarations</h2></header>
      </section>
      <section class="main-section" id="Reference">
        <header><h2>Reference</h2></header>
      </section>
    </main>
  </body>
</html>
/* 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/117.0.0.0 Safari/537.36

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

Hello!

I think this has a double angle bracket causing the problem.

1 Like

I don’t think you meant to close off this section element at the end of this line:

Also:

When you have this as an href or id attribute, it needs an underscore between ‘else’ and ‘statement’.

The related tests will pass if you fix these two things.

thankyou you’re right!!!

1 Like

yepp i just realize that i couldn’t use … in id, THANKYOU YO!

You can use ... in an id attribute. In fact you can use anything except for a space. That was the problem with your href and id attributes. You needed to replace the space with an underscore.

1 Like