Survey Form - Build a Survey Form

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here. Please I need help I am getting some of my codes wrong.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <title id="survey-form">survey-form</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="styles.css">
    </head>
    <body>
  <h1 id="title">survey-form</h1>
  <p id="description">Thank you for taking time to help us improve the platform</p>
    <form id="survey-form">
      <fieldset>
        <label for=name id="name-label">Name<input id="mame" name="name" type="text" placeholder="Enter your name" value="text" required /></label>
        <label for="email" id="email-label">Email<input id="email" name="email" type="email" placeholder="Enter your email" required /></label>
        <label for="number" id="numer-label">Age (optional)<input id="number" name="age" type="number" placeholder="Enter your age" min="15" max="120" /></label>
        <label for="current-role">Which option best decribes your current role?<select id="dropdown" name="current-role"
        <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>
        </label>
        </fieldset>
        <fieldset>
          <label for="recommend">Wound you recommend freeCodeCamp to a friend?</label>
         <label for="definitely"><input id="definitely" type="radio" name="definitely" class="inline" value="definitely" />Definitely</label>
         <label for="maybe"><input id="maybe" type="radio" value="maybe" class="inline" />Maybe</label>
         <label for="not-sure"><input id="not-sure" type="radio" value="not-sure" class="inline" />Not sure</label>
</fieldset>
<fieldset>
  <label for="favorite-feature">What is your favorite feature of freeCodeCamp?<select id="favorite-feature">
  <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>
  </label>
  </fieldset>
  <fieldset>
    <label>What would you like to see improved? (check all that apply</label>
    <label for="front-end-projects"><input id="front-end-projects" name="front-end-projects" class="inline" type="checkbox" value="checkbox" />Front-end projects</label>
    <label for="Back-end-projects"><input id="Back-end-projects" value="checkbox" type="checkbox" class="inline" />Back-end projects</label>
<label for="Data-visualization"><input id="Data-visualization" type="checkbox" value="checkbox" class="inline" />Data Visualization</label>
<label for="Challenges"><input id="challenges" type="checkbox" value="checkbox" class="inline" />Challenges</label>
<label for="Open-source-community"><input id="open-source-community" value="checkbox" type="checkbox" class="inline" />Open source community</label>
<label for="gitter-help-rooms"><input id="gitter-help-rooms" value="checkbox" type="checkbox" class="inline" />Gitter help rooms</label>
<label for="videos"><input id="videos" value="checkbox" type="checkbox" class="inline" />Videos</label>
<label for="City-meetups"><input id="city-meetups" value="checkbox" type="checkbox" class="inline" />City meetups</label>
<label for="wiki"><input id="wiki" value="checkbox" type="checkbox" class="inline" />Wiki</label>
<label for="Forum"><input id="Forum" value="checkbox" type="checkbox" class="inline" />Forum</label>
<label for="Additional-courses"><input id="Additional-courses" type="checkbox" value="checkbox" class='inline' />Additional courses</label>
</fieldset>
<fieldset>
  <label for="suggestions">Any comments or suggestions</label>
  <textarea rows="5" cols="60" id="suggestions" name='suggestions' placeholder="Enter your comments here"></textarea>
  </fieldset>
  <input id="submit" type="submit" value="submit" />
  </form>
  </body>
  </html>

/* file: styles.css */

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/115.0.0.0 Safari/537.36

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

2

Hello!

What error message are you r receiving for your code? This will allow the community to focus in that area and provide correct assistance to guide you.

Happy coding! :slight_smile:

3

Duplicate ids are not allowed in the html. The id attribute must be unique.
Check out the following id: id = "survey-form". You have it two times in your code.

  • There should be an input text field with id=“name”:
<input id="mame" ...you have a typo here
  • For the name, email, and number input fields inside the form I can see corresponding labels that describe the purpose of each field with the following ids: id=“name-label”, id=“email-label”, and id=“number-label”.
<label for="number" id="numer-label">Age (optional)<input id="number" name="age" type="number" placeholder="Enter your age" min="15" max="120" /></label> ....input's id should be equal to "number-label"

  • the opening ‘select’ tag is not closed:
    <select id="dropdown" name="current-role"

  • All your radio-buttons need a name attribute

4

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