Technical Documentation Page - Build a Technical Documentation Page

HTML-CSS
1

Tell us what’s happening:
I have run the test many times and every time I got this note: 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). I think I did what is required and everytime I click on a link the page navigates to the corresponding section element. Below are my codes for 6 links and the corresponding part of the 6 sections that the links refer to. After many revisions I can’t see what is wrong. Please tell me about what I don’t see.
Thak you in advance.
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.

 <a class="nav-link" href="#Introduction">Introduction</a>
          <a class="nav-link" href="#How to design">How to design</a>
          <a class="nav-link" href="#Free software">Free software</a>
<a class="nav-link" href="#Opensource software">Opensource software</a>
        <a class="nav-link" href="#Actual design">Actual design</a>
 <a class="nav-link" href="#Manufacturing">Manufacturing</a>


<section id="Introduction" class="main-section">
          <header class="sechead">Introduction</header>
           <a name="Introduction"></a>


<section id="How_to_design" class="main-section">
      <header class="sechead">How to design</header>
        <a name="How to design"></a>


<section id= "Free_software" class="main-section">
  <header class="sechead">Free software</header>
    <a name="Free software"></a>


</section>
    <section id="Opensource_software"  class="main-section">
      <header class="sechead">Opensource software</header>
    <a name="Opensource software"></a>


<section id= "Actual_design" class="main-section">
     <header class="sechead">Actual design</header>
       <a name="Actual design"></a>


<section id="Manufacturing" class="main-section">
    <header class="sechead">Manufacturing</header>
      <a name="Manufacturing"></a>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/106.0.0.0 Safari/537.36 Edg/106.0.1370.42

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

2

Actual_design vs href="#Actual design"

Notice the missing underscore in the second – make sure you match the spelling and format exactly or else the href destination will be wrong. You should just need the underscore but it’s also good practice to avoid capitalization on the first letter of links like this usually. Might just be my preference though.

3

In you ‘section’ elements you did it right (e.g. id=“Free_software”). But it doesn’t correspond to “href=…” values in the navbar. The same is true for all the textual headings too (e.g. “>Opensource software<”).

4

You are right. Thank you.