I think that my first survey form broke Survey Form - Build a Survey Form

HTML-CSS
1

It says that I haven’t made the h1 element with the id of title
. It also says that there is content inside the non-existent h1 element. Help
Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title id="title">hamster survey</title>
    <link rel="stylesheet" href="styles.css"/>
  </head>
  <body>
   <h1 id="title">Hamster Survey</h1>
    <p id="description">This is a survey about how your hamster(s) died</p>
  <form id="survey-form">
      <label id="name-label" for="name">Name:<input id="name" placeholder="jon doe" required type="text"></lable>
      <label id="email-label" for="email">Email:<input type="email" placeholder="example@gmail.com" required id="email"></label>
      <label id="number-label" for="number">Number of dead hamsters:<input id="number" min="0" max="999" type="number" placeholder="17"></label>
       <label for="dropdown">Did you purposfully kill one or more of the hamsters?
       <select id="dropdown">
        <option value="">select one</option>
        <option value="1">Yes</option>
        <option value="2">What is wrong with you?</option></label>
        <label><input type="radio" name="who-owned-hamster" value="owned">I owned the hamster(s)</label>
        <label><input value="didn't-own" type="radio" name="who-owned-hamster">I didn't own the hamster(s)</label>
      <p>How did your hamster(s) die? select all that apply</p>
        <label for="microwave"><input type="checkbox" id="microwave" value="microwave">Exploded in microwave</label>
        <label for="fall"><input type="checkbox" id="fall" value="fall">Was thrown/Fell out of window</label>
        <label for="radiator"><input type="checkbox" id="radiator" value="radiator">Got stuck in radiator</label>
        <label for="burned"><input type="checkbox" id="burned" value="burned">Ran into the fireplace</label>
        <label for="vacuum"><input type="checkbox" id="vacuum" value="vacuum">Got sucked up by a vacuum</label>
        <label for="car"><input type="checkbox" id="car" value="car">Was ran over by car</label>
        <label for="extra-deaths">Any other ways your hamster(s) died<textarea id="extra-deaths" placeholder="Said 'boo' and it died"></textarea></label>
       </fieldset>
        <input type="submit" id="submit">
     </select>
    </form>
  </body>
</html>

/* file: styles.css */
body{
  text-align: center;
  font-family: Marker Felt, fantasy;
  background-color:tan;
  color:white;
}
fieldset{
  border: 0
}
label{
  display:block;
}

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.6,2 Safari/605.1.15

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

2

I’m having the same problem with my test to bro idk I think its bugged right now

3

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>
4

Id’s should be unique, so you can’t have id set to video for both the section element and video element.

2 Likes
5

Same problem here, duplicate id’s.

1 Like
6

You already have a post about this. Please stop hijacking other people’s threads.