Tell us what’s happening:
I added the id of my nav-link (with the # and same name) same as my section id, but when clicking on the link its opening the lab problem in the preview tab and the test number 20 is getting failed
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>
<nav id="navbar">
<header>
<a class="nav-link" href="#Introduction">Introduction</a>
<a class="nav-link" href="#HTML-tags">HTML tags</a>
<a class="nav-link" href="#Headings">Headings</a>
<a class="nav-link" href="#Images">Images</a>
<a class="nav-link" href="#Anchors">Anchors</a>
</header>
</nav>
<main id="main-doc">
<section class="main-section" id="Introduction">
<header>Introduction</header>
<p>HTML (HyperText Markup Language) is the most basic building block of the Web. It defines the meaning and structure of web content. Other technologies besides HTML are generally used to describe a web page's appearance/presentation (CSS) or functionality/behavior (JavaScript).</p>
<p>"Hypertext" refers to links that connect web pages to one another, either within a single website or between websites. Links are a fundamental aspect of the Web. By uploading content to the Internet and linking it to pages created by other people, you become an active participant in the World Wide Web.</p>
<code><p>Hello World<p></code><br><br>
</section>
<section class="main-section" id="HTML_tags">
<header>HTML tags</header>
<p>An HTML element is set off from other text in a document by "tags", which consist of the element name surrounded by < and >. The name of an element inside a tag is case-insensitive. That is, it can be written in uppercase, lowercase, or a mixture. For example, the <title> tag can be written as <Title>, <TITLE>, or in any other way. However, the convention and recommended practice is to write tags in lowercase.</p>
<code><p>Example of Paragraph Tag<p></code><br><br>
</section>
<section class="main-section" id="Headings">
<header>Headings</header>
<p>
There are 6 type of headings:
<ol>
<li>H1</li>
<li>H2</li>
<li>H3</li>
<li>H4</li>
<li>H5</li>
<li>H6</li>
</ol>
</p>
<p>The <h1> to <h6> HTML elements represent six levels of section headings. <h1> is the highest section level and <h6> is the lowest. By default, all heading elements create a block-level box in the layout, starting on a new line and taking up the full width available in their containing block.</p>
<p>
Usage Notes
<li>Heading information can be used by user agents to construct a table of contents for a document automatically.</li>
<li>Do not use heading elements to resize text. Instead, use the CSS font-size property.</li>
<li>Do not skip heading levels: always start from <h1>, followed by <h2> and so on.</li>
</p>
<code><h1>Highest Heading</h1></code><br><br>
</section>
<section class="main-section" id="Images">
<header>Images</header>
<p>The <img> HTML element embeds an image into the document.</p>
<p>The src attribute is required, and contains the path to the image you want to embed.</p>
<p>The alt attribute holds a textual replacement for the image, which is mandatory and incredibly useful for accessibility — screen readers read the attribute value out to their users so they know what the image means. Alt text is also displayed on the page if the image can't be loaded for some reason: for example, network errors, content blocking, or link rot.</p>
<code><img>A Image Will Appear Here</img></code><br><br>
</section>
<section class="main-section" id="Anchors">
<header>Anchors</header>
<p>The <a> HTML element (or anchor element), with its href attribute, creates a hyperlink to web pages, files, email addresses, locations in the same page, or anything else a URL can address.</p>
<code><a><a href="#">ThisIsALink</a></a></code><br><br>
</section>
</main>
</body>
</html>
/* file: styles.css */
No Css written till now
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/134.0.0.0 Safari/537.36
Challenge Information:
Technical Documentation Page - Build a Technical Documentation Page
