Tell us what’s happening:
Can’t seem to get these 2 steps correct:
1)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”).
2) Each .nav-link should have an href attribute that links to its corresponding .main-section (e.g. If you click on a .nav-link element that contains the text “Hello world”, the page navigates to a section element with that id)
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.
<li> <a class="nav-link" href="#Styling_with_CSS"> Styling with CSS</a></li>
<li> <a class="nav-link" href="#Projects_to_do"> Projects to do?</a></li>
<li> <a class="nav-link" href="#References_guide" >References guide</a>
</ul>
</nav>
<section class="main-section" id="What_is_HTML"><header>What is HTML</header>
<p>What is HTML in simple definition?
HTML (HyperText Markup Language) is the most basic building block of the Web.It defines the meaning and structure of web content. Hypertext: text (often with embeds such as images, too) that is organized in order to connect related items.Markup: a style guide for typesetting anything to be printed in hardcopy or soft copy format. Language: a language that a computer system understands and uses to interpret commands.</p>
</section>
<section class="main-section" id="Where_to_learn"><header>Where to learn</header>
<ul>
<li>
<a href="FreecodeCamp.org">FreeCodeCamp
</li>
<li>
<a href="codecademy.com">codecademy
</li>
<li>
<a href="w3schools.com">W3schools
</li>
<li>
<a href="Lynda.com">Lynda
</li>
<li>
<a href="teamtreehouse.com">Teamtreehouse</a>
</li>
</ul>
</section>
<section class="main-section" id="Elements_and_tags"><header>Elements and tags</header>
<p class="sub-heading">Elements</p>
<p>HTML element holds the content.Whatever written within a HTML tag are HTML elements.HTML elements specifies the general conten</p>
<p class="sub-heading">Tags</p>
<p>HTML tags are used to hold the HTML element. HTML tag starts with < and ends with>.HTML tags are almost like keywords where every single tag has unique meaning.</p>
</section>
<section class="main-section" id="How_to_add_text"><header>How to add text</header>
<p> Text can be added using the following element:
<p><code><p></code></br>
<code><h></code></br>
<code><header></code></br>
<code><Footer></code></br>
<code><li></code></br>
<code> <lo></code>
</p>
</section>
<section class="main-section" id="Divs_and_sections"><header>Divs and Sections</header>
<p class="sub-heading">Divs</p>
The <div> tag defines a division or a section in an HTML document.
The <div> tag is used as a container for HTML elements - which is then styled with CSS or manipulated with JavaScript.
The <div> tag is easily styled by using the class or id attribute.
Any sort of content can be put inside the <div> tag.
<p class="sub-heading">Section</p>
<p>The <section> tag defines a section in a document.</p>
</section>
<section class="main-section" id="Images_and_sounds"><header>Images and sounds</header>
<p class="sub-heading">Images</p>
<p>The HTML <img> tag is used to embed an image in a web page.
Images are not technically inserted into a web page; images are linked to web pages. The <img> tag creates a holding space for the referenced image.
The <img> tag is empty, it contains attributes only, and does not have a closing tag.
The <img> tag has two required attributes:
src - Specifies the path to the image
alt - Specifies an alternate text for the image</p>
<p class="sub-heading">Audio</p>
<p>To play an audio file in HTML, use the <audio> element</p>
<p>The controls attribute adds audio controls, like play, pause, and volume.
The <source> element allows you to specify alternative audio files which the browser may choose from. The browser will use the first recognized format.
The text between the <audio> and</audio< tags will only be displayed in browsers that do not support the </audio> element.
</section>
<section class="main-section" id="Styling_with_CSS"><header>Styling with CSS</header><p>CSS can be added to HTML documents in 3 ways:
Inline - by using the style attribute inside HTML elements
Internal - by using a <style> element in the <head> section
External - by using a <link> element to link to an external CSS file</p>
</section>
<section class="main-section" id="Projects_to_do"><header>Projects to do</header>
<ul>
<li>A Tribute Page</li>
<li>Webpage Including Form</li>
<li>Parallax Website</li>
<li>Landing Page</li>
<li>Restaurant Website</li>
</section>
<section class="main-section" id="References_Guide"><header>References guide</header>
<p>
All the documentation in this page is taken from: </p>
<p> <a class="reference" href="FreeCodeCamp.org">FreeCodeCamp</a></P>
<p ><a class="reference" href="W3schools.com" >W3schools</a></p>
</section>
</main>
</body>
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36
Challenge: Technical Documentation Page - Build a Technical Documentation Page
Link to the challenge: