Product Landing Page - Build a Product Landing Page

Hey everyone, im having trouble with two requirements for succeeding this assignment.

“Your #video should have a src attribute.”
“You should have a video or iframe element with an id of video.”

To my understanding i have written the code necessary to complete these two requirements and yet in marks them as incomplete. Ive searched for answers and dint find anyone who had the same issue. If someone could take a quick glance at the video section at the bottom of the code Id like some insight. Thanks.

<!DOCTYPE html>
<html lang="en">

  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Handcrafted Ocarinas - Product Landing Page</title>
  <link rel="stylesheet" href="styles.css">
<link rel="preconnect" href="">
<link rel="preconnect" href="" crossorigin>
<link href="" rel="stylesheet">

  <header id="header">
    <img id="header-img" src="" alt="Handcrafted Ocarinas Logo">
    <nav id="nav-bar">
        <li><a class="nav-link" href="#features">Features</a></li>
        <li><a class="nav-link" href="#pricing">Pricing</a></li>
        <li><a class="nav-link" href="#contact">Contact</a></li>

  <section id="banner">
    <h1>Experience the Beauty of Handcrafted Ocarinas</h1>
    <p>Our ocarinas are carefully crafted by skilled artisans using traditional methods to produce exceptional sound quality.</p>
    <a class="button" href="#pricing">Shop Now</a>

  <section id="features">
    <div class="feature-item">
      <h3>Handcrafted with Care</h3>
      <p>Each ocarina is made by skilled artisans using traditional methods to ensure quality and durability.</p>
      <img class="front-img" src="" alt="Feature 1">
    <div class="feature-item">
       <h3>Exceptional Sound Quality</h3>
      <p>Our ocarinas produce beautiful and clear sounds that are sure to delight any music lover.</p>
      <img src="" alt="Feature 2">
    <div class="feature-item">
      <h3>Unique Designs</h3>
      <p>Our ocarinas come in a variety of unique and beautiful designs that are sure to impress.</p>
      <img src="" alt="Feature 3">

  <section id="pricing">
    <p>Choose from our selection of high-quality ocarinas:</p>
    <div class="price-item">
      <img class="Selling" src="" alt="Product 1">
      <h3>Classic Ocarina</h3>
      <p class="price">$49.99</p>
      <a class="button" href="#">Add to Cart</a>
    <div class="price-item">
      <img class="Selling" src="" alt="Product 2">
      <h3>Elegant Ocarina</h3>
      <p class="price">$59.99</p>
      <a class="button" href="#">Add to Cart</a>
    <div class="price-item">
      <img class="Selling" src="" alt="Product 3">
      <h3>Collectors Ocarina<h3>
          <p class="price">$89.99</p>
          <a class="button" href="#">Add to Cart</a>

  <section id="video">
  <h2>Product Video</h2>
  <iframe id="video" src="" frameborder="0" allowfullscreen></iframe>

  <section id="contact">
    <h2>Contact Us</h2>
    <p>Sign up for our newsletter to stay up-to-date on our latest products and offers:</p>
    <form id="form" action="">
      <label for="email">Email:</label>
      <input type="email" id="email" name="email" placeholder="Enter your email address" required>
      <input type="submit" id="submit" value="Subscribe">

    <p>Handcrafted Ocarinas &copy; 2023</p>


Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:109.0) Gecko/20100101 Firefox/111.0

Challenge: Product Landing Page - Build a Product Landing Page

Link to the challenge:

Id’s need to be unique. The section element and the iframe can’t both have an id of “video”. This is definitely throwing the tests off.

1 Like

Wow that was a quick fix thank you so much! :smile:

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