Survey Form - Build a Survey Form

Tell us what’s happening: get this error message not sure what I am missing

Your #email should be a descendant of #survey-form
Your #number should be a descendant of #survey-form .
Your #email-label should be a descendant of #survey-form
Your #number-label should be a descendant of #survey-form
Your #dropdown should be a descendant of #survey-form
You should have at least two radio buttons that are descendants of #survey-form
You should have at least two input elements with a type of checkbox (checkboxes) that are descendants of #survey-form
You should have at least one textarea element that is a descendant of #survey-form
Your #submit should be a descendant of #survey-form

Your code so far

#survey-form

WARNING

The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.

You will need to take an additional step here so the code you wrote presents in an easy to read format.

Please copy/paste all the editor code showing in the challenge from where you just linked.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="styles.css">
    <title>Document</title>
</head>
<body>
    <div>
      <heder>
      <h1 id="title" text="centerd">freeCodeCamp Survey Form</h1>
    <p id="description">Thank you for taking the time to help us improve the platform</p> 
</heder>

<form id="survey-form">
    <div="form-group">
        <label id="name-label" for ="name">
            name
        </label>
        <input
        type="text"
        name="name"
        id="name"
        class="form-coloms"
        placeholder="enter your name"
        required
        />
    </div>

    <div="form-group">
        <label id="email-label" for ="email">
            email
        </label>
        <input
        type="email"
        name="email"
        id="email"
        class="form-coloms"
        placeholder="enter your email"
        required
        />
    </div>

    <div="form-group">
        <label id="number-label" for ="age">
            age
        </label>
        <input
        type="number"
        name="age"
        id="number"
        min="21"
        max="99"
        class="form-coloms"
        placeholder="enter your age"
        required
        />
    </div>

  <div="form-group"> 
      <p>Which option best describes your current role?</p>
      <select id="dropdown" name="role" class="form-control" required>
<option display select value>Select current role</option>
<option value="student">Student</option>
<option value="job">Full Time Job</option>
<option value="learner">Full Time learner</option> 
<option value="prefuerNo">Prefuer not to say</option>
<option value="other">other</option>      
      </select>
  </div>

  <div="form-group">
      <p>Would you recommend freeCodeCamp to a friend?</p>
  <lable>
      <input
       name="user-recommend"
       value="deefinitely"
       type="radio"
       class="input-radio"
       checked/>
       definitely
  </lable>

  <lable>
      <input
       name="user-recommend"
       value="maybe"
       type="radio"
       class="input-radio"
       checked
      />
      maybe
  </lable>

<lable>
    <input
      name="user-recommend"
      value="not-sure"
      type="radio"
      class="input-radio"
      checked/>
      not sure
  </lable>
  </div>

  <div class="form-group">
      <p>What is your favorite featur of freeCodeCamp?</p>
      <select id="most-like" name="mostlike" class="form-control" required>
          <option disabled selected value>select an option</option>
          <option value="challenges">Challenges</option>
          <option value="projects">Projects</option>
          <option value="community">Community</option>
          <option value="openSource">Open Source</option>
       </select>
  </div>

<div class="form-group">
<p>What would you like to see improved? (Check all that apply)</p>
<lable>
      <input
       name="prefer"
       value="front-end-projects"
       type="checkbox"
       class="input-checkbox"
      />
      Front-end Projects
  </lable>

<lable>
      <input
       name="prefer"
       value="back-end-projects"
       type="checkbox"
       class="input-checkbox"
      />
      Back-end Projects
  </lable> 

  <lable>
      <input
       name="prefer"
       value="data-visualization"
       type="checkbox"
       class="input-checkbox"
      />
      Data Visualization
  </lable>

  <lable>
      <input
       name="prefer"
       value="challenges"
       type="checkbox"
       class="input-checkbox"
      />
      Challenges
  </lable>

  <lable>
      <input
       name="prefer"
       value="open-source-community"
       type="checkbox"
       class="input-checkbox"
      />
      Open Source Community
  </lable>

  <lable>
      <input
       name="prefer"
       value="gitter-help-rooms"
       type="checkbox"
       class="input-checkbox"
      />
      Gitter help rooms
  </lable>

  <lable>
      <input
       name="prefer"
       value="videos"
       type="checkbox"
       class="input-checkbox"
      />
      Videos
  </lable>

  <lable>
      <input
       name="prefer"
       value="city-meetups"
       type="checkbox"
       class="input-checkbox"
      />
      City Meetups
  </lable>

  <lable>
      <input
       name="prefer"
       value="wiki"
       type="checkbox"
       class="input-checkbox"
      />
      Wiki
  </lable>

  <lable>
      <input
       name="prefer"
       value="forum"
       type="checkbox"
       class="input-checkbox"
      />
      Forum
  </lable> 
  
  <lable>
      <input
       name="prefer"
       value="additional-courses"
       type="checkbox"
       class="input-checkbox"
      />
      Additional Courses
  </lable>
</div>

<div class="form-group">
<p>Any comments or suggestions?</p>
   <textarea
            id="comments"
            class="input-textarea"
            name="comment"
            placeholder="Enter your comment here..."
          ></textarea>
    </div>

    <div class="form-group">
        <button type="submit" id="submit" class="submit-button">
            Submit
          </button>
    </div>

</form>

    </div>
</body>
</html>

Your browser information:

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

Challenge Information:

Survey Form - Build a Survey Form

did you want to give a class to this div? wrong syntax can make a lot of havoc with the tests

it’s label not lable

also, left click in the editor and choose the format option

1 Like

thank you
will try that now

Hello @jayp19021993 !

I notice many of the label are spelled incorrectly. lable instead of label. Starting at this quote.

Keep up the good progress!

3 Likes

thank I have got it fixed and pass on to the next on

1 Like

Congratulations on fixing it and moving on to the next step.

Keep up the good progress @jayp19021993

1 Like