Tell us what’s happening:
I have everything else checked off on the Survey Form, except the ‘textarea’ element. I have nested it inside the form just like everything else but it’s still telling me I’m wrong. I can’t figure out where the problem is. Any help would be greatly appreciated!
**Your code so far**
/* file: index.html */
<!DOCtype HTML>
<html lang="en">
<head>
<title>freeCodecamp Survey Form</title>
<link href="styles.css" rel="stylesheet">
</head>
<body>
<h1 id="title"><b>Cat Lover Survey Form</b></h1>
<hr>
<br>
<p id="description"><strong>Greetings all cat lovers! Thank you for taking the time to spread the love of cats!</strong></p>
<fieldset>
<form id="survey-form"><form action="https://survey-form.freecodedamp.rocks" name="survey-form">
<label for="name" id="name-label">Enter Your Name: <input id="name" name="name-label" type="text" placeholder="Enter name" required /></label>
<br><br>
<label for="email" id="email-label">Email<input id="email" name="email" type="email" placeholder="Enter email" required /></label>
<br><br>
<label for="age" id="number-label">Number of current cats (optional)<input id="number" name="number" type="number" min="1" max="99" placeholder="Number of cats"/></label>
<br><br>
<label for="current breeds">What breed of cat do you currently own?<select id="dropdown" name="role">
<option value="">Please select one</option>
<option value="1">Domestic Shorthair</option>
<option value="2">Domestic Mediumhair</option>
<option value="3">Domestic Longhair</option>
<option value="4">Brachycephalic (aka smooshy face)</option>
<option value="5">Exotic</option>
</select>
<br><br>
<label for="recommend">Would you recommend that everyone owns a cat?
<br>
<input id="recommend" type="radio" name="recommend" class="inline" value="yes" />Definitely!
<br>
<input id="recommend" type="radio" name="recommend" class="inline" value="maybe" />Maybe...
<br>
<input id="recommend" type="radio" name="recommend" class="inline" value="no" />Nah, they're not for everyone
</label>
<br><br>
<label for="favorite feature">What is your favorite feature of a cat?<id="checkbox" name="feature">
<br>
<input id="toe beans" type="checkbox" class="inline" value="beans" />Toe Beans
<br>
<input id="noses" type="checkbox" class="inline" value="noses" />Little Noses
<br>
<input id="eyes" type="checkbox" class="inline" value="eyes" />Beautiful Eyes
<br>
<input id="fur" type="checkbox" class="inline" value="fur" />Luxurious Fur
<br>
<input id="personality" type="checkbox" class="inline" value="personality" />Loving Personality
<br>
<input id="whiskers" type="checkbox" class="inline" value="whiskers" />Whiskers
</label>
<br><br>
<label for="comments" id="textarea">Additional Comments:
<input type="textarea" placeholder="More cat love goes here">
<br><br>
<input type="submit" value="Submit" id="submit" />
</fieldset>
</form>
</body>
/* file: styles.css */
body{
background-image: url(https://mobileimages.lowes.com/productimages/6eb62a74-4f5d-4d6d-9c6b-0c5723f691c4/16718626.jpg?size=pdhism)
}
fieldset {
background-color: pink;
margin-bottom: 10%;
margin-left: 7%;
margin-right: 7%;
margin-top: 2.5%;
}
#description {
text-align: center;
font-size: 18px;
font-style: italic;
}
input, textarea, select {
margin: 10px 0 0;
width: 100%;
min-height: 2em;
}
h1 {
font-size: 40px;
text-align: center;
}
input[type="submit"]{
display: block;
width: 30%;
background-color: hotpink;
border-color: white;
height: 2em;
min-width: 200px;
font-size: 0.85rem;
margin: 1em auto;
}
.inline {
width: unset;
margin: 0 0.5em 0 0;
vertical-align: middle;
}
**Your browser information:**
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:104.0) Gecko/20100101 Firefox/104.0
Challenge: Survey Form - Build a Survey Form
Link to the challenge: