Technical Documentation Page - Build a Technical Documentation Page

HTML-CSS
1

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

Your code so far
I am facing None of your header elements should be empty problem. I have reviewed my code twice and i didn’t find any problem please anyone help.

<!-- file: index.html -->

<header></header><!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="widt=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="styles.css">
    <title>Certification 3</title>
  </head>
 <body>
   <nav id="navbar">
     <header>Technical Documentation Introduction.</header>
     <ul>
       <li><a href="#home" class="nav-link">Home</a></li>
       <li><a href="#about" class="nav-link">About</a></li>
       <li><a href="#team" class="nav-link">Team</a></li>
       <li><a href="#courses" class="nav-link">Courses</a></li>
       <li><a href="#contact_us" class="nav-link">Contact_Us</a></li>
     </ul>
   </nav>
   <main id="main-doc">
     <section class="main-section" id="home">
       <header>
        <h1> This is our Index page.</h1>
       </header>
       <p>lorem10</p>
       <p>lorem10</p>
       <code>#include</code>
       <li>This is Home page.</li>
      </section>
     <section class="main-section" id="about">
       <header><h1>This is our About page.</h1></header>
       <p>lorem10</p>
       <p>lorem10</p>
       <code>#include</code>
       <li>This is About page.</li>
     </section>
     <section class="main-section" id="team">
       <header><h1>Team</h1></header>
       <p>lorem10</p>
       <p>lorem10</p>
       <code>#include</code>
       <li>This is Team page.</li>
     </section>
     <section class="main-section" id="courses">
       <header><h1>Courses</h1></header>
       <p>lorem10</p>
       <p>lorem10</p>
       <code>#include</code>
       <li>This is Courses page.</li>
     </section>
     <section class="main-section" id="contact_us">
       <header><h1>Contact_Us</h1></header>
       <p>lorem10</p>
       <p>lorem10</p>
       <code>#include</code>
       <li>This is Contact page.</li>
     </section>
   </main>
 </body>
</html>

/* file: styles.css */
#navbar{
  position:fixed;
  left:0;
  top:0;
}
@media (min-width:500px) and (max-width:768px){
  a{
    font-size:16px;
  }
}

Your browser information:

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

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

2

Hi! Welcome to the forum!

Here is what is causing your problem. There should not be a header element here in the first place, regardless of if it is full or empty.

<header></header><!DOCTYPE html>

Remove it and that part of the lesson should pass.

Also, you cannot have a <li> element on its own without having a <ul> or <ol> element as its parent. This will not affect your code passing but is a syntax error to be avoided.

 <li>This is Team page.</li>
3

thankyou so much i never looked there for error. And also thankyou for the suggestion for using ul and li i will care from next time.

1 Like
6

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