Tell us what’s happening:
- Failed: All your checkboxes inside
#survey-formshould have avalueattribute and value.
I am still working on this challenge, but this is the only error I get and I cannot figure out what why. Has anyone ever had the same issue, and how did you solve it?
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<title>Survey Form</title>
<link rel="stylesheet" href="styles.css"/>
</head>
<body>
<h1 id="title">Survey Form</h1>
<p id="description">Thank you for taking the time to help us improve the platform</p>
<form id="survey-form">
<label for="name" id="name-label">Name <input type="text" id="name" name="name" placeholder="name" required/></label>
<label for="email" id="email-label">Email <input type="email" id="email" name="email" placeholder="email" required/><label>
<label for="number" id="number-label">Age (optional) <input type="number" id="number" name="age" min="10" max="120" placeholder="age"/></label>
<label for="dropdown">What option best describes your current role?
<select id="dropdown">
<option value="">select your current role</option>
<option value="1">Student</option>
<option valye="2">Full Time Job</option>
<option valye="3">Full Time Learner</option>
<option valye="4">Other</option>
</select>
</label>
<legend>What would you like to see improved?</legend>
<label for="front-end"><input type="checkbox" id="front-end" name="improvements" value="1" class="inline"/>Front-end Projects</label>
<label for="back-end"><input type="checkbox" id="back-end" name="improvements" value="2" class="inline" />Back-end</label>
<legend>Would you recommend us to a friend?</legend>
<label for="yes"><input type="radio" id="yes" name="recomendation" value="yes" class="inline" /> Definitely</label>
<label for="maybe"><input type="radio" id="maybe" name="recomendation" value="maybe" class="inline"/> Maybe</label>
<label for="no"><input type="radio" id="no" name="recomendation" value="no" class="inline" /> Not sure</label>
<label for="comments-suggestions"><textarea id="comments-suggestions" rows="3" cols="30" placeholder="Enter your insight here"></textarea></label>
<label for="terms-and-conditions"><input type="checkbox" id="terms-and-conditions" name="terms-and-conditions" required class="inline"/>I accept the <a href="">terms and conditions</a></label>
<input type="submit" value="Submit" id="submit"/>
</form>
</body>
</html>
/* file: styles.css */
body{width: 100%;
background-image: url(https://www.stockvault.net/data/2018/01/06/241692/preview16.jpg);
color: rgb(242, 242, 242);
font-family: Tahoma;
font-size: 18px;
}
h1{padding-top: 1em;}
h1,p{text-align: center;
margin: 0.5em auto;}
form{width: 60%;
max-width: 500px;
min-width: 300px;
margin: 0 auto;
background-color: rgba(0,61,82,0.7);
padding: 10px 40px;
margin-top: 30px;
border-radius: 10px
}
label{display: block;
margin: 1em 0}
input{width:100%}
.inline{width:unset;}
fieldset{border: none;
padding-left: 0px;}
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36
Challenge: Survey Form - Build a Survey Form
Link to the challenge:
