Survey Form - Build a Survey Form

Tell us what’s happening:
Describe your issue in detail here.
im struggling with these points at the moment:

  • You should have a select field with an id of dropdown.

  • Failed:Your #dropdown should have at least two selectable (not disabled) option elements.

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

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
 <meta charset="UTF-8">
<link rel="stylesheet" href="styles.css">
    </head>
    <body>
      <h1 id="title">Rugby Survey Form</h1>
<p id="description">Please fill out the required information</p>

<form id="survey-form">
  <fieldset>
<label id="name-label" for="name">Name<input id="name" type="text" placeholder="Joe Bloggs..." required></label>
<label id="email-label"for="email">Email<input type="email" id="email" placeholder="Rugby123@gmail.com..." required></label>
<label id="number-label"for="number">Number<input type="number" id="number" max="9" min="0" placeholder="07328394232..."required></label>
</fieldset>
<fieldset>
<label for="favourite">Your Favourite team
<select id="favourite" id="dropdown">
<option value="">(Select a team)</option>
<option value="1">Newcastle Falcons</option>
<option value="2">Sale Sharks</option>
</select>
</label>
<label for="position">Your Position <select id="position" id="dropdown">
<option value="">(Select a position)</option>
<option value="1">Front row</option>
<option value="2">Second row</option>
<option value="3">Back row</option>
<option value="4">Playmakers</option>
<option value="5">Centers</option>
<option value="6">Back three</option>
</select>
  </label>
</fieldset>
<fieldset>
  <label for="Favourite-player">Who's your favourite player?
    <textarea id="favourite-player" name="favourite-player" rows="1" column="1" placeholder="Richie McCaw..."></textarea>
    </label>
  </fieldset>
<fieldset>
<label for="terms-and-conditions" name="terms-and-conditions" required><input type="radio" id="terms-and-conditions" class="inline" />I accept the <a href="https://www.freecodecamp.org/news/terms-of-service/" />terms and conditions</label>
<label for="age-agreement" name="age-agreement"><input type="radio" id="age-agreement" class="inline">By sumbiting the form I agree that I am over the age of 13yrs old</label>
</fieldset>
<input type="Submit" value="Submit" />
</form>

      </body>
      </html>
/* file: styles.css */
body {width: 100%;
  height: 100vh;
  margin: 0;
  background-color: #1b1b32;
  color: #f5f6f7;
  font-family: Tahoma;
  font-size: 16px;}
h1, p {
  margin: 1em auto;
  text-align: center;
}
form {
  width: 60vw;
  max-width: 500px;
  min-width: 300px;
  margin: 0 auto;
}
fieldset {border:none; text-align:center;}

input,select {width:100%;
margin:10px 0 0 0;
min-height:1em;
}
option {text-align:center;
font-size:14px;}
.inline{width: unset;
  margin: 0 0.5em 0 0;
  vertical-align: middle;}

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:

your code has syntax errors that will cause the tests to fail.
To find them all, copy and paste your html into this online validator

Try to fix as many of the errors as you can (you can ignore the warning/info messages)

Thank you very much :slight_smile:

1 Like