Survey Form - Build a Survey Form

Won’t pass the test:
" You should have at least one textarea element that is a descendant of #survey-form"

As far as I can see the textarea input is within the form element bounds and the submit button below it and the name input above both pass their respective descendant of survey-form tests.

Tried to create a style to to change all descendants of .survey-form that were also a textarea’s background color to grey, didn’t work, so don’t think it’s an issue with the test.

Can’t see what’s wrong with the code. Not had much experience with HTML, probably something obvious.

Thanks for any help you can give.

  **Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html>
<head>
    <link rel= "stylesheet" href="style.css"/>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>freeCodeCamp Survey Form</title>
</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 id="survey-form">
    <section>
    <fieldset>
      <label id="name-label">Name
      <input id="name" required placeholder="Enter your name"></label>
      <label id="email-label">Email
      <input id="email" type="email" required placeholder="Enter your Email" pattern=[a-z0-9]*@[a-z0-9]*></label>
      <label id="number-label">Age (optional)
      <input id="number" type="number" min="10" max="99" placeholder="Age"></label>
      </fieldset>
      </section>
      <section>
      <fieldset>
      <label id="currentrole-label">Which option best describes your current role?</label>
      <select id="dropdown">
        <option>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>
        </fieldset>
        </section>
        <section>
        <fieldset>
      <label>Would you recommend freeCodeCamp to a friend?</label>
      <fieldset name="radios">
        <input name="recommend-radio" type="radio" value="1"><label> Definitely</label>
        <input name="recommend-radio" type="radio" value="2"><label> Maybe</label>
        <input name="recommend-radio" type="radio" value="3"><label> Not sure</label>
        </fieldset>
        </fieldset>
        </section>
        <section>
        <fieldset>
        <label id="favoritefeature-label">What is your favorite feature of freeCodeCamp?</label>
      <select id="favoritefeature">
        <option>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>
      </section>
      <section>
      <fieldset>
    <label id="improvements-label">What would you like to see improved?</label> <label id="checkall-label">(Check all that apply)</label>
      <fieldset name="check">
    <input id="frontend" type="checkbox" value="1"><label> Front-end Projects</label>
    <input id="backend" type="checkbox" value="2"><label> Back-end Projects</label>
    <input id="datavisualization" type="checkbox" value="3"><label> Data Visualization</label>
    <input id="challenges" type="checkbox" value="4"><label> Challenges</label>
    <input id="opensource" type="checkbox" value="5"><label> Open Source Community</label>
    <input id="gitter" type="checkbox" value="6"><label> Gitter help rooms</label>
    <input id="videos" type="checkbox" value="7"><label> Videos</label>
    <input id="citymeetups" type="checkbox" value="8"><label> City Meetups</label>
    <input id="wiki" type="checkbox" value="9"><label> Wiki</label>
    <input id="forum" type="checkbox" value="10"><label> Forum</label>
    <input id="additionalcourses" type="checkbox" value="11"><label> Additional Courses</label>
    </fieldset>
    </section>
    <section>
      
      <label id="comments-label">Any comments or suggestions?</label>
    <input id="textarea" type="textarea" placeholder="Enter your comment here..." />
    </section>
      <section>
      <input id="submit" name="Submit" type="submit">
    </section>
  </form>
</body>  
</html>
/* 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/103.0.0.0 Safari/537.36

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

A textarea is an actual HTML element.

<input id="textarea" type="textarea" placeholder="Enter your comment here..." />

This is an input with type of textarea, which is an invalid type. You need to change this to an actual textarea element.

Thank you! This resolved the problem.

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