Tell us what’s happening:
Please Help. FCC tester says that I must have at least two radio buttons that are descendants of the #survey-form. I am getting the same error message for my element. I have tried everything I have seen on the forums an even tried using chat-GPT to solve this issue…to no avail.
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Survey Form</title>
<link rel="stylesheet" href="styles.css"
</head>
<body>
<header>
<h1 id="title">Travel Form</h1>
<p id="description">Please fill out this form with your details.</p>
</header>
<div>
<fieldset><legend>Account Information</legend>
<form id="survey-form">
<p><label for="name" id="name-label">Name</label><input id="name" type="text" placeholder="John Smith" required/></p>
<p><label for="email" id="email-label"> Email </label> <input id="email" type="email" placeholder="john.smith@yahoo.com" required></p>
<p><label for="number" id="number-label"> Number</label><input id="number" min="1" max="120" type="number" placeholder="Number"> </p>
<label for="dropdown">Account Type<select id="dropdown">
<option value="Personal">Personal</option>
<option value="Business">Business</option>
</select>
</label>
</div>
<fieldset>
<legend>Preferred Travel Method</legend>
<input type="radio"id="driving" name="commute"value="driving">
<label for="driving">Driving</label>
<input type="radio"id="flying" name="commute"value="flying">
<label for="flying">Flying</label>
</fieldset>
<fieldset>
<legend>Travel Purpose</legend>
<input type="radio" id="Work" name="travel-purpose" value="Work"><label for="Work">Work</label>
<input type="radio" id="Adventure" name="travel-purpose" value="Adventure"
<label for="Adventure">Adventure</label>
</fieldset>
<fieldset>
<legend>Select Your Favorite States To Travel To</legend>
<div>
<input type="checkbox" id="Oklahoma" name="Oklahoma" value="Oklahoma"/>
<label for="Oklahoma">Oklahoma</label>
</div>
<div> <input type="checkbox" id="Idaho" name="Idaho" value="Idaho">
<label for="Idaho"> Idaho</label>
</div>
<div>
<input type="checkbox" id="Montana" name="Montana" value="Montana">
<label for="Montana">Montana</label>
</div>
<div>
<input type="checkbox" id="Alaska" name="Alaska" value="Alaska">
<label for="Alaska">Alaska</label>
</div>
<div>
<input type="checkbox" id="Colorado" name="Colorado" value="Colorado">
<label for="Colorado">Colorado</label>
</div>
</fieldset>
</div>
<div class="area">
<label> Tell Us Why You Love To Travel!</label>
<textarea placeholder="Have Fun With It!" name="travel-experience"></textarea>
</div>
<input type="submit" id="submit">
</form>
</body>
</html>
/* file: styles.css */
textarea {
height: 200px;
width: 400px;
margin: center;
font-size: 16px;
scrollHeight:0;
}
h1 {
text-align:center;
}
.area {
margin: ;
text-align: center;
}
legend {
text-align: center;
}
body{
background-image: url("https://images.unsplash.com/photo-1519681393784-d120267933ba?fm=jpg&q=60&w=3000&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8M3x8bGFuZHNjYXBlJTIwd2FsbHBhcGVyfGVufDB8fDB8fHww");
background-size: cover;
background-repeat: no-repeat;
background-attachment: scroll;
background-color: #1d3c6e;
color: white;
}
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/132.0.0.0 Safari/537.36
Challenge Information:
Survey Form - Build a Survey Form