Technical Documentation Page - Build a Technical Documentation Page

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

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">
    <title>technical documentation page</title>
    <link rel="stylesheet" href="styles.css">

  </head>

<body>
  <main id="main-doc">
    <nav id="navbar">
      <header>Navbar</header>
      <a class="nav-link" href="#project_team">Projectteam</a>
      <a class="nav-link" href="#tutoria_team">Tutoriateam</a>
      <a class="nav-link" href="#manager">Projectmanager</a>
      <a class="nav-link" href="#data_team">Datateam</a>
      <a class="nav-link" href="#safety_team">Safetyteam</a>
    
</nav>
    <section class="main-section" id="project_team"><heafer>Project Team</header>
    <p><i><a href="project_team">Project Team</a></i>The team that design the project<strong>the company</strong></p>
    <code></code>
    <p>Project teams are categorized of two type: <br>
    <ol>
      <li>Project Teams (Manager)</li>
      <li>Project Teams (Supervisor)</li>
      </ol></p>
    </section>

    <section class="main-section" id="tutoria_team">
      <header>Tutoria Team</header>
      <article class="technical"><a href="tutorial_team">Tutoria</a>
      <code></code>
      <p>Teachers the major team here that taught the staff on the current project</p>



    </section>

    <section class="main-section" id="manager">
      <header>Manager</header>
      <article class="technical"><p><a href="manager">Manager</a>are the arrow head to the company</p></article>
      <code></code>
      <p>Manager are the major risk taker in promoting the affairs of the company</p>
    </section>

    <section class="main-section" id="data_team"><header>Data Team</header>
    <article class="technical"><p><a href="data_team">Data Teams</a>are the ones who store every information about the company to the server</p>
    <code></code>
    <p>There is two types of storage here: <br>
    <>ul>
    <li>Digital</li>
    <li>Analog</li>
    </ul></p>

    <p>Digital storage is the process of storing your information in the server</p>
    <p>While the Analog storage is the process of storing all your information on hard copy</p>
    </article>
    
    </section>

    <section class="main-section" id="safety_team"><header>Safety Team</header>
    <article class="technical"><p><a href="safety_team">Safety Team</a>is the teams that made sure every staff safe during the oppression</p>
    <code></code>

    <p>Safety of every staff should be a guranttee</p>
    <ul><li>Safety wears</li></ul>
    
    </article>
    </section>
  </main>
 
 
</body>
</html>
/* file: styles.css */
@media (max-width: 768px){
  #main-doc{
    display: flex;
    width: 100%;
   
  }
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.3; Win64; x64; rv:109.0) Gecko/20100101 Firefox/111.0

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

Hi everyone!

I have been on this very Technical Documentation page since two day now, and am unable to pass.

The three questions am unable to below;

Failed: The first child of each .main-section should be a header element.
Failed: 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").

Please can anyone give more light to enable pass it?

You have a typo here:

Fixing this will sort out the first two failing tests.

As for the nav-links, their text does not match the text of their corresponding header elements (e.g. ‘Projectteam’ does not match ‘Project Team’).

You should probably go through your whole code and check that you’re naming everything consistently, as even when you make the necessary adjustments to fix the issues above, you may then trigger further issues. There are also a number of spelling errors and/or typos throughout the project.

They are all minor fixes though and the project should be ready to pass with a few tweaks!

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