Product Landing Page

The test requirements are:

  • You should have a video or iframeelement with an id of video.
  • Failed:Your #video should have a srcattribute.
  • Failed:You should have a form element with an id of form.
    Your #form should have an action attribute of https://www.freecodecamp.com/email-submit

I failed these steps but I implemented the code

<html>

<head>
  <title>My Product Landing Page</title>
  <link rel="stylesheet" href="styles.css">
  <style>
    /* CSS styles go here */
  </style>
</head>

<body>
  <header id="header">
    <img id="header-img" src="logo.png" alt="My Product Logo">
    <nav id="nav-bar">
      <a class="nav-link" href="#features">Features</a>
      <a class="nav-link" href="#pricing">Pricing</a>
      <a class="nav-link" href="#testimonials">Testimonials</a>
    </nav>
  </header>

  <section id="features">
    <h1>Features</h1>
    <p>Our product has many amazing features that will help you get the most out of it.</p>
  </section>

  <section id="pricing">
    <h1>Pricing</h1>
    <p>Our product is available at a competitive price that will fit your budget.</p>
  </section>

  <section id="testimonials">
    <h1>Testimonials</h1>
    <p>Don't just take our word for it - see what our satisfied customers have to say about our product.</p>
  </section>

  <section id="video">
    <h1>Watch our Product Video</h1>
    <video  id="video" src="https://www.youtube.com/embed/TCEgdiN0A8s" controls>

    </video>
   
  </section>

  <section id="form">
    <h1>Sign Up for Our Product</h1>
    <form action="https://www.freecodecamp.com/email-submit" id="form">
      <label for="email">Email:</label>
      <input id="email" name="email" type="email" placeholder="Enter your email address" required>
      <input type="submit" id="submit" value="Submit">
    </form>

Please post a link to the project you are working on.

https://www.freecodecamp.org/learn/2022/responsive-web-design/build-a-product-landing-page-project/build-a-product-landing-page

You can’t have different elements use the same id.
Remove the id on the section element.

Also you seem to be missing a body closing tag.

Try to check your code for other errors of this type.

Here’s another issue with duplicate ids…

1 Like

This is just an addition to what has already been said:
Where did you put a declaration?

<!DOCTYPE html>

Where is the ‘lang’ attribute, and what is its value in the opening ‘html’ tag?
Where is the closing ‘html’ tag?
Where is the closing ‘section’ tag for the last ‘section’ element?

Post the code in its entirety for us to understand what the issue is.

1 Like

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