Survey Form - Build a Survey Form

HTML-CSS
1

Tell us what’s happening:
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 . To me they seem descendants of the survey form so I do not get what is the problem. Please help.

   **Your code so far**

/* file: index.html */
<!DOCTYPE html>
<html>
 <head>
   <h1 id="title">FreeCodeCamp Survey Form</h1>
   <link rel="stylesheet" href="styles.css">
 </head>
 <body>
     <p id="description">Thank you for taking the time to help us improve the platform</p>
 <fieldset>
 <form id="survey-form">
  <label id="name-label"> Name: <input id="name" type="text" placeholder="Enter your name" required/></label>
  <label id="email-label">Email: <input id="email" type="email" placeholder="Enter your email" required/></label>
  <label id="number-label">Age(optional) <input id="number" type="number" min="13" max="120" placeholder="Age"/></label>
 <label> Which option best describes your current role? <select id="dropdown" name="referrer">
    <option value="">(select current role)</option>
    <option value="2">Student</option>
    <option value="3">Full time job</option>
    <option value="4">Full time learner</option>
    <option value="5">Prefer not to say</option>
  </select>
  </label>
  </fieldset>
  <fieldset>
    Would you recommend freeCodeCamp to a friend? 
 <label> <input type="radio" value="recommend" name="recommend" class="inline"/>Definitely</label>
 <label><input type="radio" value="recommend" name="recommend" class="inline"/>Maybe</label>
 <label><input type="radio" value="recommend" name="recommend" class="inline"/>Not sure</label>
 </fieldset>
 <fieldset>
 What would you like to see improved?
<label> <input type="checkbox" name="improved" value="front-end"/>Front-end Projects</label>
 <label><input type="checkbox" name="improved" value="back-end"/>Back-end Projects</label>
 <label><input type="checkbox" name="improved" value="data-visualisation"/>Data Visualisation</label>
  <label><input type="checkbox" name="improved" value="challenges"/>Challenges</label>
   <label><input type="checkbox" name="improved" value="open-source community"/>Open Source Community</label>
    <label><input type="checkbox" name="improved" value="gitter help"/>Gitter Help Rooms</label>
   <label><input type="checkbox" name="improved" value="videos"/>Videos</label>  
   </fieldset>
   <fieldset>
   <label>Any comments or suggestions?
     <textarea name="comments" rows="3" cols="30" placeholder="Enter your comment here..."></textarea>
     </label>
     <input id="submit" type="submit" value="Submit" />
     </fieldset>
 </form>
 </body>
 </html>

/* file: styles.css */
body {
 width: 100%;
 height: 100vh;
 margin: 0;
 background-color: #A9A9A9;
	color: #f5f6f7;
 font-family: Tahoma;
	font-size: 16px;
}

h1, p {
 margin: 1em auto;
 text-align: center;
}

label {
 display: block;
	margin: 0.5rem 0;
}

textarea {
 margin: 10px 0 0 0;
	width: 100%;
 min-height: 2em;
}

input[type="submit"] {
 display: block;
 width: 60%;
 margin: 1em auto;
 height: 2em;
 font-size: 1.1rem;
 min-width: 300px;
}

   **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:

2

You should validate your HTML.

3

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