Product Landing Page - Build a Product Landing Page

[Zerai00]

<ul>
          <li class="nav-link"><a href="#Features">Features</a></li>
          <li class="nav-link"><a href="#how-it-works">how it works</a></li>
          <li class="nav-link"><a href="#pricing">pricing</a></li>
        </ul>
      </nav>
    </header>
    <section id="hero">
      <h2>Handcrafted, home-made masterpieces</h2>
      <form id="form" action="https://www.freecodecamp.com/email-submit">
        <input name="email" type="email" id="email" placeholder="Enter your email" required <input>
        <input type="submit" id="submit" value="GET STARTED">
      </form>
    </section>


<div class="container">
      <div id="Features">
        <div class="grid">
          <div class="icon">
            <i class="ri-firefox-fill"></i></div>
          <div class="text">
            <h2>
              Premium Materials</h2>
              <p clas="para">Our trombones use the shiniest brass which is sourced locally. This will increase the longevity of your purchase.</p>
            </div>
            </div>
        <div class="grid">
          <div class="icon"><i class="ri-caravan-fill"></i>
            
            </div>
          <div class="text">
            <h2>
              Fast Shipping</h2>
              <p class="para">We make sure you recieve your trombone as soon as we have finished making it. We also provide free returns if you are not satisfied.</p>
            
            </div>
        </div>


<div class="grid">
          <div class="icon"><i class="ri-battery-charge-fill"></i>
          </div>
            
          
          <div class="text">
            <h2>
              Quality Assurance</h2>
              <p class="para">For every purchase you make, we will ensure there are no damages or faults and we will check and test the pitch of your instrument.</p>
      </div>
      </div>
      </div>
      <div> <iframe id="video" name="how-it-works" width="560" height="315" src="https://www.youtube.com/embed/mU6anWqZJcc" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe></div>



<div id="pricing">
        <div class="product">
          <div class="level">TENOR TROMBONE</div>
          <h2>$600</h2>
          <ol>
            <li>Lorem ipsum </li>
            <li>Lorem ipsum </li>
            <li>Lorem ipsum </li>
          </ol>
          <button class="btn">Select</button>
        </div>
        <div class="product">
          <div class="level">BASS TROMBONE</div>
          <h2>$900</h2>
          <ol>
            <li>Lorem ipsum </li>
            <li>Lorem ipsum </li>
            <li>Lorem ipsum </li>
          </ol>
          <button class="btn">Select</button>
        </div>
        <div class="product">
          <div class="level">VALVE TROMBONE</div>
          <h2>$1200</h2>
          <ol>
            <li>Lorem ipsum </li>
            <li>Lorem ipsum </li>
            <li>Lorem ipsum </li>
          </ol>
          <button class="btn">Select</button>
        </div>
      </div>



</div>
  </body>
  </html>

[Zerai00]

• Each .nav-link element should have an href attribute.

• Failed:Each .nav-link element should link to a corresponding element on the landing page (has an href with a value of another element’s id. e.g. #footer).

I need help please

[Cryptic_X]

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

[Cryptic_X]

I don’t see any element with the id of how-it-works.

[Zerai00]

      
        <ul>
          <li class="nav-link"><a href="#Features">Features</a></li>
          <li class="nav-link"><a href="#How_It_Works">How It Works</a></li>
          <li class="nav-link"><a href="#Pricing">Pricing</a></li>
        </ul>
 

i find my bug. i put the class=“nav-link” in the

element THX !!