Tell us what’s happening:
Describe your issue in detail here.
Hello, i’m getting two error’s on the test and im unsure why. I would like to know where im going wrong please.
-
Each
.main-sectionshould have anidthat matches the text of its first child, having any spaces in the child’s text replaced with underscores (_) for the id’s. -
Each
.nav-linkshould have anhrefattribute that links to its corresponding.main-section(e.g. If you click on a.nav-linkelement that contains the text “Hello world”, the page navigates to asectionelement with that id).Your code so far
/* file: index.html */
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Technical Documentation</title>
<meta name="Technical Documentation" content="technical documentation">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="Technical_Documentation_Page\styles.css">
</head>
<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>
</ul>
</nav>
<body>
<main id="main-doc">
<section id="Introduction" class="main-section">
<header>Introduction</header>
<article>
<p></p>
<p></p>
<ul>
<li></li>
<li></li>
</ul>
</article>
</section>
<section id="What_you_should_already_know" class="main-section">
<header>What you should already know</header>
<article>
<p></p>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</article>
</section>
<section id="'Javascript_and_Java" class="main-section">
<header>Javascript and Java</header>
<article>
<p></p>
<p></p>
<p></p>
</article>
</section>
<section id="Hello_World" class="main-section">
<header>Hello World</header>
<article>
<p></p>
<code></code>
<p></p>
</article>
</section>
<section id="Variables" class="main-section">
<header>Variables</header>
<article>
<p></p>
<p></p>
<p></p>
<code></code>
<code></code>
<code></code>
<code></code> <!-- code only used for test -->
</article>
</section>
</main>
<script src="" async defer></script>
</body>
</html>
/* file: styles.css */
#navbar {
position: fixed;
}
**Your browser information:**
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:104.0) Gecko/20100101 Firefox/104.0
Challenge: Technical Documentation Page - Build a Technical Documentation Page
Link to the challenge:
