Build a survey form- my code doesn't pass

Curriculum Help
1

Alright so this project I did on my own without relying on step by step instruction and although my code seems to be correct it still doesn’t pass many tests.
Here’s the code

<!DOCTYPE html>
<html lang="en">
  <head>
  <meta charset="utf-8">
  <title>Survey Form</title>
  <link rel="stylesheet" href="styles.css" />
</head>
<body>
  <h1 id="title">Survey Form by Z</h1>
  <p id="description">Please answer the following questions.</p>
  <form method="post" id="survey-form">
    <label for="name-label">Enter your name:
        <input id="name" type="text" placeholder="John Smith" value="Name" required />
    </label>
    <label for="email">Enter your E-mail:
        <input id="email" type="email" value="Email" name="email" placeholder="johnsmith@gmail.com" required />
    </label>
    <label for="numericInput">What's your age?</label>
    <input id="number" type="number" name="numericInput" min="1" max="100" value="numericInput" placeholder="18" />
    
    <label for="dropdown">Select your gender:</label>
    <select id="dropdown" name="dropdown">
      <option value="option1">Male</option>
      <option value="option2">Female</option>
      <option value="option3">No you don't get to choose "other"</option>
    </select>
    <fieldset>
      <legend>Where do you live?</legend>
      <label for="location-india"><input id="location-india" type="radio" name="location" value="location" class="inline" />India</label>
      <label for="location-saudi"><input id="location-saudi" type="radio" name="location" value="location" class="inline" />Saudi Arabia</label>
      <label for="location-other"><input id="location-other" type="radio" name="location" class="inline" value="location" />Other</label>
      </fieldset>
      <label for="hobbies">What are your hobbies?</label>
      <input id="hobbies" type="checkbox" name="hobbies" value="hobbies" class="inline" />Reading </label>
      <input id="hobbies" type="checkbox" name="hobbies" value="hobbies" class="inline" />Cooking </label>
      <input id="hobbies" type="checkbox" name="hobbies" value="hobbies" class="inline" />Baking</label>
      <input id="hobbies" type="checkbox" name="hobbies" value="hobbies" class="inline" />Studying (ok nerd) </label>
      <input id="hobbies" type="checkbox" name="hobbies" value="hobbies" class="inline" />Gardening </label>
      <input id="hobbies" type="checkbox" name="hobbies" value="hobbies" class="inline" />Traveling</label>
      <input id="hobbies" type="checkbox" name="hobbies" value="hobbies" class="inline" />Internet Surfing</label>
      <input id="hobbies" type="checkbox" name="hobbies" value="hobbies" class="inline" />Painting/Drawing</label>
      <input id="hobbies" type="checkbox" name="hobbies" value="hobbies" class="inline" />Work Out</label>
      <input id="hobbies" type="checkbox" name="hobbies" value="hobbies" class="inline" />Walking</label>
      <input id="hobbies" type="checkbox" name="hobbies" value="hobbies" class="inline" />Playing Sports</label>
      <input id="hobbies" type="checkbox" name="hobbies" value="hobbies" class="inline" />Watching movies/series</label>

   <label for="personal-comment">What's one thing you want to accomplish in 2024?
     <textarea id="personal-comment" rows="3" cols="35" placeholder="I wish to travel overseas in 2024..."></textarea>
   </label>
   <input type="submit" id="submit" />
  </form>

</body>
</html>

And here are the instructions it doesn’t pass no matter how many changes I make

  • You should have a label element with an id of name-label.

  • Failed:You should have a label element with an id of email-label.

  • Failed:You should have a label element with an id of number-label.

  • Failed:Your #name-label should contain text that describes the input.

  • Failed:Your #email-label should contain text that describes the input.

  • Failed:Your #number-label should contain text that describes the input.

  • Failed:Your #name-label should be a descendant of #survey-form.

  • Failed:Your #email-label should be a descendant of #survey-form.

  • Failed:Your #number-label should be a descendant of #survey-form.
    can someone please tell me what’s wrong or what I can do to fix the issues?

2

You do not have any of the required elements and ids. The test is telling you what you are missing.

3

no actually I do. i dont know why it didnt paste here my code but look:

<html lang="en">
  <head>
  <meta charset="utf-8">
  <title>Survey Form</title>
  <link rel="stylesheet" href="styles.css" />
</head>
<body>
  <h1 id="title">Survey Form by Z</h1>
  <p id="description">Please answer the following questions.</p>
  <form method="post" id="survey-form">
    <label for="name-label">Enter your name:
        <input id="name" type="text" placeholder="John Smith" value="Name" required />
    </label>
    <label for="email">Enter your E-mail:
        <input id="email" type="email" value="Email" name="email" placeholder="johnsmith@gmail.com" required />
    </label>
    <label for="numericInput">What's your age?</label>
    <input id="number" type="number" name="numericInput" min="1" max="100" value="numericInput" placeholder="18" />
    
    <label for="dropdown">Select your gender:</label>
    <select id="dropdown" name="dropdown">
      <option value="option1">Male</option>
      <option value="option2">Female</option>
      <option value="option3">No you don't get to choose "other"</option>
4

okay this is really weird. I swear I have typed out all the code of the necessary elements but when I paste it here, it disappears???

5 
<label for="name-label">Enter your name:
  <input id="name" type="text" placeholder="John Smith" value="Name" required />
</label>
  • You should have a label element with an id of name-label.

Read the test messages carefully.

I would suggest you revisit how you connect labels and inputs.

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

Pre-formatted-text
Pre-formatted-text1356×380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

6
  • You should have a label element with an id of name-label.
    For example the line below should be:
    Mod edit: removed
7

alright thankyou and i will keep your advice in mind.