Tell us what’s happening:
Describe your issue in detail here.
“Your #navbar should have exactly one header
element within it.”
this is the only error i am getting out of all the tasks.
I don’t know what’s wrong in my code.
Please help me.
Your code so far
<!-- file: index.html -->
<head>
<link rel="stylesheet" href="styles.css">
</head>
<main id="main-doc">
<section class="main-section" id="First_section">
<header>
First section
</header>
<p>This is the first section which has h1 element</p>
<p>It also contains paragraph element</p>
<code>
This is sample code 1.
</code>
<ul>
<li>HTML and CSS</li>
</ul>
<nav id="navbar">
<header>This is the first section</header>
<a href="#First_section" class="nav-link">First section</a>
</nav>
</section>
<section class="main-section" id="Second_section">
<header>
Second section
</header>
<p>This is the second section which has h2 element</p>
<p>It also contains paragraph element</p>
<code>
This is sample code 2.
</code>
<ul>
<li>Javascript</li>
</ul>
<nav id="navbar">
<header>This is the second section</header>
<a href="#Second_section" class="nav-link">Second section</a>
</nav>
</section>
<section class="main-section" id="Third_section">
<header>
Third section
</header>
<p>This is the third section which has h3 element</p>
<p>It also contains paragraph element</p>
<code>
This is sample code 3.
</code>
<ul>
<li>Python</li>
</ul>
<nav id="navbar">
<header>This is the third section</header>
<a href="#Third_section" class="nav-link">Third section</a>
</nav>
</section>
<section class="main-section" id="Fourth_section">
<header>
Fourth section
</header>
<p>This is the fourth section which has h4 element</p>
<p>It also contains paragraph element</p>
</header>
<code>
This is sample code 4.
</code>
<ul>
<li>React</li>
</ul>
<nav id="navbar">
<header>This is the fourth section</header>
<a href="#Fourth_section" class="nav-link">Fourth section</a>
</nav>
</section>
<section class="main-section" id="Fifth_section">
<header>
Fifth section
</header>
<p>This is the fifth section which has h5 element</p>
<p>It also contains paragraph element</p>
</header>
<code>
This is sample code 5.
</code>
<ul>
<li>Bootstrap</li>
</ul>
<nav id="navbar">
<header>This is the first section</header>
<a href="#Fifth_section"class="nav-link">Fifth section</a>
</nav>
</section>
</main>
/* file: styles.css */
@media only screen and (max-width: 600px) {
#nav {
background-color: lightblue;
}
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/116.0.0.0 Safari/537.36
Challenge: Technical Documentation Page - Build a Technical Documentation Page
Link to the challenge: