** All of your .nav-link elements should be in the #navbar**
** You should have the same number of .nav-link and .main-section elements.**
I don’t know where I’ve gone wrong here, but it’s saying I have an extra nav-link somewhere on the page and I looked over and over and can’t find it. Maybe I’m not looking hard enough, but there is a challenge that I completed successfully that seems to negate the theory on an extra nav-link somewhere:
** 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”).**
Your code so far
WARNING
The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.
You will need to take an additional step here so the code you wrote presents in an easy to read format.
Please copy/paste all the editor code showing in the challenge from where you just linked.
<!DOCTYPE html>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<html>
<head>
<title>HTML Documentation</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<nav id="navbar">
<header class="nav-header">HTML Nav</header>
<ul>
<li>
<a class="nav-link" href="#Introduction">Introduction
</li>
<li>
<a class="nav-link" href="#Basics/Fundamentals">Basics/Fundamentals
</li>
<li>
<a class="nav-link" href="#Getting_Started">Getting Started
</li>
<li>
<a class="nav-link" href="#Elements">Elements
</li>
<li>
<a class="nav-link" href="#Attributes">Attributes
</li>
<li>
<a class="nav-link" href="#Tags">Tags
</li>
<li>
<a class="nav-link" href="#CSS">CSS
</li>
</ul>
</nav>
<main id="main-doc">
<section class="main-section" id="Introduction">
<header>Introduction</header>
<p>The HyperText Markup Language or HTML is the standard markup language for documents designed to be displayed in a web browser. It is often assisted by technologies such as Cascading Style Sheets (CSS) and scripting languages such as JavaScript.</p>
</section>
<section class="main-section" id="Basics/Fundamentals">
<header>Basics/Fundamentals</header>
<p>What you should already know:</p>
<li>A proficient amount of knowledge of the internet and how to use it web to find a website.</li>
<li>How to use developer tools to see how websites are built.</li>
</section>
<section class="main-section" id="Getting_Started">
<header>Getting Started</header>
<p>The building blocks of HTML</p>
<li>Elements</li>
<li>Attributes</li>
<li>Tags</li>
<p>In order to get into HTML it's important to know what these are.</p>
</section>
<section class="main-section" id="Elements">
<header>Elements</header>
<p>HTML documents imply a structure of nested HTML elements. These are indicated in the document by HTML tags, enclosed in angle brackets thus: <code>< p ></code></p>
<p>In the simple, general case, the extent of an element is indicated by a pair of tags: a "start tag" <code>< p ></code> and "end tag" <code>< /p ></code>. The text content of the element, if any, is placed between these tags.</p>
<p>The start tag may also include the element's attributes within the tag.</p>
</section>
<section class="main-section" id="Attributes">
<header>Attributes</header>
<p> are special words used inside the opening tag to control the element's behaviour. HTML attributes are a modifier of a HTML element type. An attribute either modifies the default functionality of an element type or provides functionality to certain element types unable to function correctly without them. In HTML syntax, an attribute is added to a HTML start tag.</p>
<p>HTML attributes generally appear as name–value pairs, separated by =, and are written within the start tag of an element, after the element's name:
<div></div>
<code>< attribute="value" ></code>
</section>
<section class="main-section" id="Tags">
<header>Tags</header>
<p>An Element is a full pair of tags (a start and an end tag).</p>
<p> <code>< i ></code> <code>< / i ></code>
<div></div>
<p>That is two tags</p>
</section>
<section class="main-section" id="CSS">
<header>CSS</header>
<p>Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language such as HTML or XML (including XML dialects such as SVG, MathML or XHTML). CSS is a cornerstone technology of the World Wide Web, alongside HTML and JavaScript.</p>
<p>CSS is designed to enable the separation of content and presentation, including layout, colors, and fonts. This separation can improve content accessibility; provide more flexibility and control in the specification of presentation characteristics; enable multiple web pages to share formatting by specifying the relevant CSS in a separate .css file, which reduces complexity and repetition in the structural content; and enable the .css file to be cached to improve the page load speed between the pages that share the file and its formatting.</p>
<p>A style sheet consists of a list of rules. Each rule or rule-set consists of one or more selectors, and a declaration block.</p>
<p><code> (body) {width: 100%} </code></p>
</section>
</main>
</body>
</html>
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36
Challenge: Technical Documentation Page - Build a Technical Documentation Page
Link to the challenge: