Survey Form - Build a Survey Form

HTML-CSS
1 
<!DOCTYPE html>
<html lan="en">
  <head>
    <title> Survey Form </title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="UTF-8">
    <link rel="stylesheet" href="styles.css">
  </head>
<body>
    <h1 id="title">FreeCodeCamp Survey Form</h1>
    <p id="description"> Thank you for taking the time to help us improve the platform</p>
 <form action="" id="survey-form">
    <div class="form-div">
      <label id="name-label">Name</label>
       <input type="text" id="name" name="name" placeholder="Enter your Name" required>
       </div>
       <div class="form-div">
   <label id="email-label">Email</label>
   <input type="email" id="email" name="email" placeholder="Enter your Email" required>
   </div>
   <div class="form-div">
   <label id="number-label">Age (optional)</label>
     <input type="number" min="1" max="120" id="number" name="age" placeholder="Age">
     </div>
     <div class="form-div">
       <label id="dropdown">Which option best describes your current role?</label>
       <select id="dropdown">
         <option value"">Select current role</option>
         <option value"1">Student</option>
         <option value"2">Full Time Job</option>
         <option value"3">Full Time Learner</option>
         <option value"4">Prefer Not To Say</option>
         <option value"5">Other</option>
      </select>
      </div>
      <div class="form-div">
        <label id="label-radio">Would you recommend freeCodeCamp to a friend?</label>
        </div>
        <div class="form-radio">
          <label id="definitely"><input type="radio" value="definitely" name="recommend">Definitely</label>
          </div>
        <div class="form-radio">
          <label id="maybe"><input type="radio" value="maybe" name="recommend">Maybe</label>
          </div>
        <div class="form-radio">
          <label id="notsure"><input type="radio" value="notsure" name="recommend">Not sure</label>
      </div>
    <div class="form-div">
       <label id="dropdown">Which option best describes your current role?</label>
       <select id="dropdown">
         <option value"">Select an option</option>
         <option value"1">Challenges</option>
         <option value"2">Projects</option>
         <option value"3">Community</option>
         <option value"4">Open Source</option>
      </select>
      </div>
      <div class="form-div">
          <label id="label-checkbox"> What would you like to see improved? (Check all that apply)</label>
        </div>
        <div class="div-checkbox">
          <input type="checkbox" name="improvement" value="1">Front-end Projects</label>
      </div>
      <div class="div-checkbox">
          <input type="checkbox" name="improvement" value="2">Back-end Projects</label>
      </div>
      <div class="div-checkbox">
          <input type="checkbox" name="improvement" value="3">Data Visualization</label>
      </div>
      <div class="div-checkbox">
          <input type="checkbox" name="improvement" value="4">Challenges</label>
      </div>
      <div class="div-checkbox">
          <input type="checkbox" name="improvement" value="5">Open Source Community</label>
      </div>
      <div class="div-checkbox">
          <input type="checkbox" name="improvement" value="6">Gitter help rooms</label>
      </div>
      <div class="div-checkbox">
          <input type="checkbox" name="improvement" value="7">Videos</label>
      </div>
      <div class="div-checkbox">
          <input type="checkbox" name="improvement" value="8">City Meetups</label>
      </div>
      <div class="div-checkbox">
          <input type="checkbox" name="improvement" value="9">Wiki</label>
      </div>
      <div class="div-checkbox">
          <input type="checkbox" name="improvement" value="10">Forum</label>
      </div>
      <div class="div-checkbox">
          <input type="checkbox" name="improvement" value="11">Additional Courses</label>
      </div>
      <br/>
      <div class="form-div">
<label id="label-textarea">Any comments or suggestions?</label>
        <textarea name="suggestion" placeholder="Enter your comment here..."></textarea>
      </div>
      <div class="form-div">
        <input id="submit" type="submit" value="Submit">
     </div>
  </form>
</body>
</html>

Your browser information:

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

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

2

“You should have a select field with an id of dropdown .” I am missing this task please help

3

These can’t have the same id. Id’s must be unique. Also, I’m assuming you meant to use the for attribute on the label.

You have another select that is also using “dropdown” as the id. You’ll need to change one of them to use a different id.

4

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