Product Landing Page - Build a Product Landing Page

Tell us what’s happening:

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.

<!DOCTYPE html>
<html lang="en">
<head> 
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, inital-scale=1.0">
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" integrity="sha512-9usAa10IRO0HhonpyAIVpjrylPvoDwiPUiKdWk5t3PyolY1cOd4DSE0Ga+ri4AuTroPR5aQvXU9xC6qOPnzFeg==" crossorigin="anonymous" referrerpolicy="no-referrer">
<title> Trombone Landing Page </title> 
</head>
<body>
<header class="header" id="header">
<img class="logo" id="header-img" src="https://cdn.freecodecamp.org/testable-projects-fcc/images/product-landing-page-logo.png" alt="logo">
<nav class="nav-bar" id="nav-bar">
<div class="nav-link">
<a href="#main">Features</a>
</div>
<div class="nav-link">
<a href="#video">How it Works</a>
</div>
 <div class="nav-link">
 <a href="#price">Pricing</a>
 </div>
 </nav>
</header>
  <br>
  <div class="heading">
  <h2 class="heading">Handcrafted, home-made masterpieces</h2>
  </div>
<div class="form">
<form id="form" action="https://www.freecodecamp.com/email-submit">
<input type="email" name="email" id="email" placeholder="Enter Your Email">
<br>
   <input type="submit" id="submit" value="Get Started">
    </form>
    </div>
<section class="main" id="main">
<div class="main-section">
<h3><i class='fa-solid fa-fire-flame-curved orange-color'></i> Premium Materials</h3>
<p>Our trombones use the shiniest brass which is sourced locally. This will increase the longevity of your purchase.<p>
  <h3> <i class='fas fa-truck-moving'></i> Fast Shipping</h3>
  <p>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>
  <h3><i class='fa fa-battery'></i> Quality Assurance</h3>
  <p>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>
  <br>
 <div class="video">
<iframe id="video" width="500" height="300" src="https://www.youtube.com/embed/y8Yv4pnO7qc" title="Roman Carnival Overture Op. 9 for Five Trombones">
</iframe>
   </div>
   <br>
<div class="pricing" id="price">  
<div class="price">
<h4>Tenor</h4>
<h5>600$</h5>
<ul>
<li>Lorem ipsum.</li>
<li>Lorem ipsum.</li>
<li> Lorem ipsum dolor.</li>
<li>Lorem ipsum.</li>
</ul>
<div class="select">
<button>Select</button>
</div>
</div>
<div class="price">
<h4>Bass Trombone</h4>
<h5>900$</h5>
<ul>
<li>Lorem ipsum.</li>
<li>Lorem ipsum.</li>
<li>Lorem ipsum dolor.</li>
<li>Lorem ipsum.</li>
</ul>
<div class="select">
<button>Select</button>
</div>
</div>
<div class="price">
<h4>Valve Trombone</h4>
<h5>1200$</h5>
<ul>
<li>Plays similar to a Trumpet</li>
<li>Great for Jazz Bands</li>
<li> Lorem ipsum dolor.</li>
<li>Lorem ipsum.</li>
</ul>
<div class="select">
<button>Select</button>           
</div>
</div>
</div>
   </section>
   <br>
<div class="footer">
            <a href="#main">Privacy</a>
            <a href="#video">Terms</a>
            <a href="#price">Contact</a>
   <p>Copyright 2016, Original Trombones</p>
            </div>
 </body>
 </html>

I’m getting errors for no href linked to my nav-links and nav-link not corresponding to the correct id attributes. My links are working though so I’m not sure why I’m getting this error. All 3 of my links have the href attribute and the correct ID attributes because the links are clickable and go to the specified sections so I’m not sure did i mess up elsewhere which is causing this error ? or am i missing something in the nav-links


**Your browser information:**

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

**Challenge:**  Product Landing Page - Build a Product Landing Page

**Link to the challenge:**
https://www.freecodecamp.org/learn/2022/responsive-web-design/build-a-product-landing-page-project/build-a-product-landing-page

The links themselves need to have the nav-link class. Not the divs that wrap them.

oh that makes sense thanks it worked.

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