Technical Documentation Page - Build a Technical Documentation Page

I’m struggling to link my nav bar to the sections

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>SEO Doc</title>
    <link rel="stylesheet" href="./styles.css">
</head>
<body>
  <main id='main-doc'>
    <nav id='navbar'>
      <header>SEO Doc</header>
      <ul>
        <li>
      <a class='nav-link' href='#SEO Intro'>SEO Intro</a></li>
       <li>
      <a class='nav-link' href='#What does SEO stand for'>What does SEO stand for</a></li>
       <li>
      <a class='nav-link' href='#What is EAT'>What is EAT</a></li>
       <li>
      <a class='nav-link' href='#Google Algorithm'>Google Algorithm</a></li>
       <li>
      <a class='nav-link' href='#Is it worth it'>Is it worth it</a></li>
       <li>
      <a class='nav-link' href='#Final Thoughts'>Final Thoughts</a></li>
       <li>
      <a class='nav-link' href='#Areas of SEO'>Areas of SEO</a></li>
      </ul>
      </nav>
    <section class='main-section' id='SEO_Intro'>
    <header>SEO Intro</header>
    <article>
    <p>SEO is a technical process used to optimise a website's technical configuration, content trustworthiness and link relevance so that it ranks favourably with Google's algorithm.</p>
       <p></p>
    </article>
    </section>
      <section class='main-section' id='What_does_SEO_stand_for'>
    <header>What does SEO stand for</header>
    <article>
    <p>...................
    </p>
    <code>Enter your code here</code>
    <p></p>
    </article>
    </section>
     <section class='main-section' id='What_is_EAT'>
      <header>What is EAT</header>
    <article>
    <p>...................</p>
        <code>Enter your second code here</code>
    <p></p>
    </article>
    </section>
     <section class='main-section' id='Google_Algorithm'>
       <header>Google Algorithm</header>
    <article>
    <p>...................</p>
    <code>Enter your third code here</code>
    <p></P>
    </article>
    </section>
     <section class='main-section' id='Is_it_worth_it'>
        <header>Is it worth it</header>
    <article>
    <p>...................</p>
    <code>Enter your fourth code here</code>
    <p></P>
    </article>
    </section>
     <section class='main-section' id='Final_Thoughts'>
         <header>Final Thoughts</header>
         <p></P>
    <article>
      <code>Enter your fifth code here</code>
    <p>...................</p>
    <p></p>
    </section>
    <section class='main-section' id='Areas_of_SEO'>
         <header>Areas of SEO</header>
    <UL>
      <li>Technical</li>
      <li>On-Page</li>
      <li>Off-Page</li>
      <li>Local</li>
      <li>These four areas will help create the perfect SEO strategy</li>
    </UL>
    </article>
    </section>
</body>
</html>
/* file: styles.css */

Your browser information:

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

Challenge Information:

Technical Documentation Page - Build a Technical Documentation Page

Your ID attributes don’t exactly match your href in the navbar. If the ID has hyphens, so should the href

1 Like

if i want to change the font color for my heading what is the CSS for it?

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.