HTML Survey Form -- Everything Else Works, Please Help!

Tell us what’s happening:
This is not my completed form, but I wanted to ensure that everything worked before fiddling with css. When I Run the Tests, everything comes back with a checkmark, except for “You should have a select field with an id of dropdown.” I’ve checked my code multiple times and compared it to other examples from past lessons, yet it’s still not passing, so I’m totally lost on what I’ve done wrong here.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Romance Readers Registration</title>
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>
    <h1 id="title">Romance Readers Registration</h1>
    <p id="description">Thank you for signing up! We're happy to have you.</p>
    <form id="survey-form">
    <fieldset>
      <label for="name" id="name-label">Enter Your Full Name:
      <input id="name" type="text" required placeholder="Jane Austen"></label>
      <label for="email" id="email-label">Enter Your Email:
      <input id="email" type="email" required placeholder="JaneA@email.com"></label>
      <label for="number" id="number-label">Enter Your Age:
      <input id="number" type="number" min="18" max="120" placeholder="18"></label>
      <label for="dropdown" id="dropdown">How many books do you want to read per month?
      <select id="dropdown" name="dropdown" required>
        <option value="">(select one)</option>
        <option value="1">1-2</option>
        <option value="2">3-4</option>
        <option value="3">5+</option>
      </select></label>
    </fieldset>
    <fieldset>
      <label for="author">Are you an author or looking to be published?
      <input type="radio" id="author" value="1" name="yes-no">Yes
      <input type="radio" id="author" value="2" name="yes-no">No</label>
      <label for="readers">If looking to publish, do you need beta readers?
      <input type="radio" id="readers" value="1" name="yes-no2">Yes
      <input type="radio" id="readers" value="2" name="yes-no2">No</label>
      <label for="publish-count" id="publish-count">If yes, how many books have you published? <input id="publish-count" type="number" min="0" max="1000" placeholder="0"></label>
      <label for="published-titles" id="published-titles">Feel free to share those titles here, we'd love to promote your work! <textarea id="published-titles" name="published-titles" rows="6" cols="50" placeholder="Pride And Prejudice, Emma,..."></textarea>
    </fieldset>
    <fieldset>
     <label for="subgenres" id="subgenres">What subgenre(s) are you most interested in?</label>
       <input class="subgenres" value="fantasy" type="checkbox">Fantasy
       <input class="subgenres" value="sci-fi" type="checkbox">Sci-Fi
       <input class="subgenres" value="contemporary" type="checkbox">Contemporary 
       <input class="subgenres" value="dystopian" type="checkbox">Dystopian
       <input class="subgenres" value="thriller" type="checkbox">Thriller
       <input class="subgenres" value="historical" type="checkbox">Historical
       <input class="subgenres" value="LGBT" type="checkbox">LGBT
    </fieldset>
    <input id="submit" type="submit" value="Submit">
    </form>
  </body>
</html>

/* file: styles.css */
label {display:block;margin: 0.5rem 0;}
.subgenres {
  display:inline-block}

Your browser information:

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

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

Remove this duplicate id from the label code.
Every id should be unique.

Oh, I wasn’t aware! Thank you, thank you!

1 Like