Responsive Web Design Projects - Build a Product Landing Page Nav Link

The nav links navigate to the corresponding sections of the site here but the code will not pass the tests.
Also, how do you see the error message details in the editor on freecodecamp? I just get a blue X with no further details.

  **Your code so far**
/* file: index.html */
  <link rel="stylesheet" href="styles.css">
    <div id ="desc">
      <header id="header">
         <nav id="nav-bar">
            <li><a href="features" class"nav-link">Features</a></li>
       <li><a href="how-it-works" class="nav-link">How
         It Works</a></li>
      <li><a href="pricing" class="nav-link">Pricing</a></li>

          <img id="header-img" src=""
          alt="original fitness logo">


        <form id="form" 
          <input name="email" id="email" type="email"
          placeholder="Enter your email address" required>
          <input id="submit" type="submit" value="Get Started"

        <!-- Features -->
      <section id="features">

      <div class="desc">
        <h3>Quality food, not to much</h3>
        <p>Mostly plants, no processed junk. Dont know what Im
           talking about you need my program. </p>

        <div class="desc">
          <h3> A Lifetime of Results </h3>
          <p>Not just for weeks, months, a lifetime. Give 
            yourself the gift of self discipline to turn 
            the dream of health into a reality. </p> 

        <div class="container">
           <!-- Pricing -->
        <section id="pricing">
          <div id="box-container">
          <div id = "box-1">
          <div class="product" id="beginner">
            <!-- Video -->
          <section id="how-it-works">
          <iframe id="video" height="315" width="500"
          src= "" 
                  title="YouTube video" 




/* file: styles.css */{

.logo > img {
width: 50%;
height: 10%;
max-width: 300px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
margin-left: 20px;

header {
justify-content: space-between;
padding-top: 30px 10%;
max-width: 100%;  
#header-img {
height: 115px;
margin-top: -18px;
max-width: 100%;
float: right;
display: inline-block;
cursor: pointer;


#box-1 {
margin-bottom: 55em;

#box-container {
margin-bottom: 55em;


  **Your browser information:**

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

Challenge: Responsive Web Design Projects - Build a Product Landing Page

Link to the challenge:

You forgot to add = to class in your first nav-link.

Well that was part of it. Nice catch. Thank you!

Still wont pass the tests though. Ill keep at it.

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