Survey Form - Build a Survey Formour #number should be a descendant of #survey-form. Failed:Your #number should have a type of number. Failed:Your #number shoul

HTML-CSS
1

PLEASE HELP

  • our #number should be a descendant of #survey-form.
  • Failed:Your #number should have a type of number.
  • Failed:Your #number should have a min attribute with a numeric value.
  • Failed:Your #number should have a max attribute with a numeric value.
  • Failed:You should have a label element with an id of name-label.
  • Failed:You should have a label element with an id of email-label.
  • Failed:You should have a label element with an id of number-label.
  • Failed:Your #name-label should contain text that describes the input.
  • Failed:Your #email-label should contain text that describes the input.
  • Failed:Your #number-label should contain text that describes the input.
  • Failed:Your #name-label should be a descendant of #survey-form.
  • Failed:Your #email-label should be a descendant of #survey-form.
  • Failed:Your #number should have a placeholder attribute and value.Tell us what’s happening:
    Describe your issue in detail here.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="styles.css">
<meta charset="UTF-8">
  <title>Survey form</title>
</head>
<body>
<h1 id="title">Mandy's teaching academy Survey form</h1>
<p id="description">You will fill out a survey form just to give us so information about yourself</p>
<form id="survey-form">
<fieldset>
<label for="name" > Name <br>
<input  type="text" id="name" name="survey-form" placeholder="Enter your name" class="personal" required/>
</label> <br>
<label for="email">Email <br>
<input type="email" id="email" placeholder="Enter your email" class="personal" required name="survey-form"/> 
</label> <br>
<label for="number-label"> Age <br>
<input type="number" id="number-label" min="13" max="120" placeholder="Age" class="personal" name="survey-form"
required />
</label>
</form>
<p>Which option best describe your current role</p>
<select id="dropdown">
  <option>select one</option>
  <option>employed</option>
  <option>unemployed</option>
  <option>student</option>
</select>
<p>Would you recommend the acaemy to your friend?</p>
<input type="radio" id="yes" value="do" class="bad" name="survey-form">
<label for="yes">Yes</label>
<input type="radio" id="no" value="dont" class="bad" name="survey-form"/>
<label for="no">No</label> <br>
<p>What is your favourite language at the acdamey</p>
<input type="checkbox" id="eng" class="bad" name="survey-form" value="eng"/>
<label for="eng">English</label>
<input type="checkbox" id="xh" class="bad" name="survey-form" value="xh"/>
<lable for="xh" >Xhosa</label> <br>
<p>Any comments or suggestions</p> 
<textarea id="survey-form"></textarea> <br>
<input type="submit"  id="submit" class="dd" name="survey-form"/>
</fieldset>
</body>
</html>


/* file: styles.css */
body{
font-family: 'Poppins', sans-serif;
font-size: 1rem;
font-weight: 400;
line-height: 1.4;
background-color: rgba(136,136,206,0.7);
margin: 0;
}
fieldset{
background-color:rgb(15,50,100);
font-family: arial;
}
label{
margin: 15px; 
margin-right: 10px;
margin-left: 1em;
}
.personal{
height: 30px;
width: 300px;
border-radius: 7px;
border: solid;
border-color: white;
margin: 1em;
margin-top: 10px;
}
.bad{
height: 15px;
width: 20px;
margin: 10px;
}
.dd{
margin: 15px;
background-color: green;
width: 400px;
height: 40px;
}
textarea{
  height: 80px;
  width: 400px;
  margin: 15px;
}
p{
margin-left: 15px;
margin-bottom: px;
}
select{
height: 30px;
width: 300px;
border-radius: 7px;
border: solid;
border-color: white;
margin: 1em;
margin-top: 10px;

}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/116.0.0.0 Safari/537.36

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

2

Hello campers, welcome to the forum!
Looks like your code can be fixed with some of these:

  • Move the id="number-label" from the age input to the age input label
  • Add id="number" to the age input
  • Add id="name-label" to the name input label
  • Add id="email-label" to the email input label
3

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