Tell us what’s happening:
Hi, I am on the first part of the HTML cert and I can not get my code accepted for the ’ * You should have a select
field with an id
of dropdown
. question. Is there something wrong with how I described my select field below? I just put in <select id=“dropdown” . . . so I am not sure what is wrong
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<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>
<form id="survey-form">
<div classname="Name">
<label for="name" id="name-label">Name<input id="name" type="text" name="name" placeholder="Enter your name" required/></div>
<label for="email" id="email-label">Email<input id="email" type="email" name="email" placeholder="Enter your Email" required/></label>
<label for="number" id="number-label">Age (optional)<input id="number" type="number" name="number" min="13" max="120" placeholder="Age"/></label>
<label for="dropdown" id="dropdown" >Which option best describes your current role?
<select id="dropdown" name="dropdown">
<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>
</label>
</select>
<div classname="Recommend"> <label for="Recommend">Would you recommend freeCodeCamp to a friend?</label>
<label for="Definitely"><input id="Definitely" type="radio" name="Recommend" class="inline" value="Definitely" /> Definitely</label>
<label for="Maybe"><input id="Maybe" type="radio" name="Recommend" class="inline" value="Maybe" /> Maybe</label>
<label for="Not Sure"><input id="Not Sure" type="radio" name="Recommend" class="inline" value="Not Sure" />Not Sure</label>
</div>
<label for="favorite" id="favorite">What is your favorite feature of freeCodeCamp?</label>
<select id="dropdown" name="Select current role">
<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 for="Improvement">What would you like to see improved? (Check all that apply)</label>
<label for="Front-End Projects"><input id="Front-End Projects" type="Checkbox" value="Front-End Projects">Front-End Projects</label>
<label for="Back-End Projects"><input id="Back-End Projects" type="Checkbox" value="Back-End Projects"/>Back-End Projects</label>
<label for="Data Visualization"><input id="Data Visualization" type="Checkbox" value="Data Visualization">Data Visualization</label>
<label for="Challenges"><input id="Challenges" type="Checkbox" value="Challenges">Challenges</label>
<label for="Open Source Community"><input id="Open Source Community" type="Checkbox" value="Open Source Community">Open Source Community</label>
<label for="Gitter help rooms"><input id="Gitter help rooms" type="Checkbox" value="Gitter help rooms">Gitter help rooms</label>
<label for="Videos"><input id="Videos" type="Checkbox" value="Videos">Videos</label>
<label for="City Meetups"><input id="City Meetups" type="Checkbox" value="City Meetups">City Meetups</label>
<label for="Wiki"><input id="Wiki" type="Checkbox" value="Wiki">Wiki</label>
<label for="Forum"><input id="Forum" type="Checkbox" value="Forum">Forum</label>
<label for="Additional Courses"><input id="Additional Courses" type="Checkbox" value="Additional Course">Additional Courses</label>
<label for="bio">Any comments or suggestions?
<textarea id="suggestions" name="suggestions" rows="4" cols="40" placeholder="Enter your comments here"></textarea>
</label>
<input id="submit" name="submit" type="submit" value="Submit"/>
</form>
</htlm>
/* file: styles.css */
form {
width: 75vw;
margin: 0 auto;
padding-bottom: 2em;
background-color: rgb(50, 0, 100);
color: white;
}
h1, p{text-align: center;}
input[type="submit"] {
display: block;
width: 80%;
margin: 1em auto;
height: 2em;
font-size: 1.1rem;
background-color: rgb(0,185,0);
min-width: 300px;
color: white;
}
bio{margin: auto;}
label {
display: block;
margin: 0.5rem 0;
}
Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/111.0.0.0 Safari/537.36
Challenge: Survey Form - Build a Survey Form
Link to the challenge: