Survey Form - Build a Survey Form -- I need assistance please

Tell us what’s happening:
Describe your issue in detail here.

  **Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css">
<h1 id="title">freeCodeCamp Survey Form</h1>
<p id="description">Thank you for taking the time to help us improve the platform </p>

<fieldset class="form-family">

<form id="survey-form">

<label id="name-label">Name<input type="text" id="name" name="name" placeholder="Enter your name" required></label>
<label id="email-label">Email<input type="email" id="email" name="email"placeholder="Enter your email" required></label>
<label id="number-label">Age (optional)<input type="number" id="number" name="email"placeholder="Age" min="10" max="99"></label>

<p> Which option best describe your current role?</p>

<select id="dropdown">
<option>select your current role</option>
<option>Full Time Job</option>
<option>Full Time Learner</option>
<option>Prefer not to say</option>


<p>Would you recommend FreecodeCamp to a friend?</p>

<label><input type="radio" value="definitely" name="recommendation">Definitely </label>
<label><input type="radio" value="maybe" name="recommendation">Maybe </label>
<label><input type="radio" value="not sure" name="recommendation">Not sure </label>

<p>What is your favorite feature of freeCodeCamp?</p>
<select id="dropdown">
<option>select an option</option>
<option>Open source</option>

<p>What would you like to see improved? (Check all that apply)</p>

<label><input type="checkbox" id="value"  name="preference" value="front-end projects">Front-end Projects</label>

<label><input type="checkbox" name="preference" value="back-end projects">Back-end Projects</label>

<label><input type="checkbox" name="preference" value="data visualization">Data Visualization</label>

<label><input type="checkbox" name="preference" value="challenges">Challenges</label>

<label><input type="checkbox" name="preference" value="open source community">Open Source Community</label>

<label><input type="checkbox" name="preference" value="gitter help rooms">Gitter help rooms</label>

<label><input type="checkbox" name="preference" value="videos">Videos</label>

<label><input type="checkbox" name="preference" value="city meetups">City Meetups</label>

<label><input type="checkbox" name="preference" value="wiki">Wiki</label>

<label><input type="checkbox" name="preference" value="forum">Forum</label>

<label><input type="checkbox" name="preference" value="additional courses">Additional Courses</label>


  <p>Any comments or suggestions?</p>
  <textarea id="comments" rows="3" cols="30">Enter your comments here... </textarea>

<label><button type="submit" id="submit"> Submit</button> </label>

/* file: styles.css */

  **Your browser information:**

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

Challenge: Survey Form - Build a Survey Form

Link to the challenge:


  1. You should have at least two radio buttons that are descendants of #survey-form .

  2. You should have at least two input elements with a type of checkbox (checkboxes) that are descendants of #survey-form .

  3. All your checkboxes inside #survey-form should have a value attribute and value.

  4. You should have at least one textarea element that is a descendant of #survey-form .

  5. Your #submit should be a descendant of #survey-form .

  6. Your #dropdown should be a descendant of #survey-form.


Required is not an allowed attribute on a form element. This may be causing some of the issues you’ve listed.

I’m seeing some syntax errors that need cleaning up. Such as the <head> element not having a closing tag, and the <body> element not having an opening tag.

I’d advise running your code though a html validator.

I fixed the syntax issues but still, nothing really changed. I removed “required” from the form element as well.

Still not paasing. Thanks anyway.

That mistake is on me, I missed this the first time I looked at your code.

This element <fieldset class="form-family"> is preventing the other elements from being decedents of #survey-form.

To make sure everything is a decedent of #survey-form, that element needs to wrap around the whole form, nothing inside the form should come before it.

1 Like

I moved the fieldset down into the form element and it worked. Thanks

1 Like

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