Hello So I can’t seem to pass the task of " * You should have at least 3 .nav-link
elements within the #nav-bar
." However when I look at my code I have 3 nav links classes there (features, how it works, and pricing). I have tried about 15 minutes before asking for help as well looked in the forums. Please advise.
Your code so far
<!-- file: index.html -->
<!Doctype html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="styles.css"/>
</head>
<header id="header">
<head id="header-img">
<img src="https://cdn.freecodecamp.org/testable-projects-fcc/images/product-landing-page-logo.png" alt="logo" width="400px" class="logo"
id="header-img">
</head>
<nav id="nav-bar">
<a href="features" class="nav-link"><p id="features">Features</p></a>
</nav>
<a href="how-it-works" class="nav-link"><p id="how-it-works">How it works</p></a>
<a href="pricing" class="nav-link" ><p id="pricing">Pricing</p></a>
</nav>
</header>
<body>
<h2>Handcrafted, home-made masterpieces</h2>
<form id="form" action="https://www.freecodecamp.com/email-submit">
<input id="email" placeholder="Enter your email address" type="email" name="email" pattern="default@example.com" />
<input id="submit" type="submit"/>
</form>
<p id="pricing"> Pricing</p>
<p id="how-it-works"> how it works</p>
<p id="features"> Features</p>
<iframe id="video" src="https://youtu.be/y8Yv4pnO7qc">
</body>
</html>
/* file: styles.css */
.nav-bar {
position: top;
z-index: 1000;
}
@media (max-width: 650px) {
#ul {
flex-direction: column;
}
}
header {
display: flex;
}
Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 Safari/537.36
Challenge: Product Landing Page - Build a Product Landing Page
Link to the challenge: