In this section [ “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 try different ways but it does not work.
Pretty hard to tell with just a screenshot, but does those elements you are linking exists on the page?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link href="./landpage.css" rel ="stylesheet">
</head>
<body>
<a name = "start">
<header id="header">
</a> <img id ="header-img" src="https://cdn.freecodecamp.org/testable-projects-fcc/images/product-landing-page-logo.png">
<nav id="nav-bar">
<a href="#Features" class="nav-link">Features</a>
<a href="#How-It-Works" class="nav-link">How It Works</a>
<a href="#Pricing" class="nav-link">Pricing</a>
</nav>
</header>
</a>
<main>
<div id = "contact-block">
<form id="form" action="https://www.freecodecamp.com/email-submit" method="get">
<label for="email" id="email-label"> Handcrafted, home-made masterpieces</br></label>
<input type="email" id="email" name="email" placeholder="Enter your email"></input>
<div id="button-container">
<input type="submit" id="submit" value="GET STARTED"></input>
</div>
</form>
</div>
<a name = "Features">
<div id = "info-block">
<ul id = "info-list">
<li id = "info-li"><p><strong>Premium Materials</strong> </br>
Our trombones use the shiniest brass which is sourced locally. This will increase the longevity of your purchase.</p></li>
<li id = "info-li"> <p><strong>Fast Shipping</strong> </br>
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></li></li>
<li id ="info-li"></li><strong>Assurance</strong> </br>
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></li> </li>
</ul>
</div>
</a>
<a name = "How it works">
<div id="video-id">
<video id="video">
<source src="https://www.youtube.com/embed/y8Yv4pnO7qc" >
</video>
</div>
</a>
<a name = "Pricing">
<div id = "columns-block">
<div id="col">
<div id="header-col">TENOR TROMBONE</div>
<div id="h2-col"><p>$600</p></div>
<div id="col-text"><p>Lorem ipsum. </br>
Lorem ipsum.</br>
Lorem ipsum dolor.</br>
Lorem ipsum.</br></p></div>
<div id="col-button">
<form id="button-form">
<input id = "button" type="button" value="SELECT">
</form>
</div>
</div>
<div id="col">
<div id="header-col">BASS TROMBONE</div>
<div id="h2-col"><p>$900</p></div>
<div id="col-text"> <p>Lorem ipsum.</br>
Lorem ipsum.</br>
Lorem ipsum dolor.</br>
Lorem ipsum.</p></div>
<div id="col-button">
<form id="button-form">
<input id = "button" type="button" value="SELECT">
</form>
</div>
</div>
<div id="col">
<div id="header-col">VALVE TROMBONE</div>
<div id="h2-col"><p>$1200</p></div>
<div id="col-text"><p>Plays similar to a Trumpet</br>
Great for Jazz Bands</br>
Lorem ipsum dolor.</br>
Lorem ipsum.</p></div>
<div id="col-button">
<form id="button-form">
<input id = "button" type="button" value="SELECT">
</form>
</div>
</div>
</div>
<footer id="footer">
<a href="#privacy">Privacy</a>
<a href="#terms">Terms</a>
<a href="#contact">Contact</a>
</footer>
</main>
</body>
</html>
What exactly is that?
The HTML specs define a name attribute, but it’s mostly used for JS and is not valid on all elements, for instance the anchor tag is not one of them.
I think the test is failing because your link don’t point to anything in the page… there’s no valid Features element in the page.
Hope this helps 
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.