Tell us what’s happening:
Describe your issue in detail here.
i’m confused i think i’ve got everything right but a little test run shows that my code is wrong. here’s what’s wrong with my code:
-
You should have a
label
element with anid
ofname-label
. -
Failed:You should have a
label
element with anid
ofemail-label
. -
Failed:You should have a
label
element with anid
ofnumber-label
. -
Failed:Your
#name-label
should not be empty. -
Failed:Your
#email-label
should not be empty. -
Failed:Your
#number-label
should not be empty. -
Failed:Your
#name-label
should be a descedant of#survey-form
. -
Failed:Your
#email-label
should be a descedant of#survey-form
. -
Failed:Your
#number-label
should be a descedant of#survey-form
.
can anyone help me? i’m so confused on what was wrong with my code any help would be much appreciated thank you.
here’s a pic for reference
**Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html>
<head class="header"><!-- header-->
<link rel="stylesheet" href="styles.css">
<title>Survey Form Project</title>
</head>
<body>
<main class="Title-of-form"><!--title-->
<h1 id="title"> Spuuvy's Survey Form</h1>
</main>
<p id="description">Please fill out all relevant informations below</p><!--User form entry-->
<hr>
<br><br>
<form id="survey-form">
<div class="#survey-form">
<label id="#name-label">Please enter your full name :</label>
<input id="name" type="text" placeholder="jeff bezos" required>
<br>
<label id="#email-label">Please enter your email/gmail :</label>
<input type="email" id="email" placeholder="epep@gmail.com" required>
<br>
<label id="#number-label">Please enter your age :</label>
<input id="number" type="number" min="16" max="90" placeholder="16-90">
</div>
<div class="subjects">
<p>Pick Your Favorite branch of science :</p>
<select id="dropdown" name="favorite">
<option value=""> Please Select One</option>
<option value="1"> Natural Sciences</option>
<option value="2"> Social Sciences</option>
<option value="3"> Formal Sciences</option>
</select>
</div>
<div class="radio-button">
<p>Tick your field of study</p>
<label for="psychology" class="radio-label"> Psychology</label>
<input type="radio" id="psychology" value="psychology" name="study-field">
<label for="Engineering" class="radio-label">Engineering</label>
<input type="radio" id="Engineering" value="Engineering" name="study-field">
<label for="Astrophysics" class="radio-label">Astrophysics</label>
<input type="radio" id="Astrophysics" value="Astrophysics" name="study-field">
</div>
<div class="checkie">
<p>What Are Your Hobbies ?</p>
<label for="Reading">Reading</label>
<input type="checkbox" name="Reading" value="Reading">
<label for="Playing video games">Playing video games</label>
<input type="checkbox" name="Playing video games" value="Playing video games">
<label for="Singing">Singing</label>
<input type="checkbox" name="Singing" value="Singing">
</div>
<div class="feedbacks">
<p>Feedbacks :</p>
<textarea id="comments" name="comments" placeholder="Enter Your Comment"></textarea>
</div>
<div class="ending">
<p>Thank you for filling up my survey, please submit using the button bellow :</p>
<button type="submit" id="submit">Submit</button><!--submit button-->
</div>
</form>
</html>
/* file: styles.css */
body{
display:block;
background-color:black;
color:white;
margin:0 auto;
text-align:center;
padding:0.5rem auto;
font-size:1.125rem;
font-weight: 400;
line-height: 1.4;
}
button{
width:75%;
font-size:100%;
background-color:red;
color:white;
}
textarea{
width:50%
}
main{
font-family: Arial;
}
.#survey-form{
padding:2;
text-align:center;
}
**Your browser information:**
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.5060.114 Safari/537.36 Edg/103.0.1264.49
Challenge: Build a Survey Form
Link to the challenge: