Tell us what’s happening:
Im trying to get the last user story, I cannot find any other way to write its syntax, and when I select the buttons in the preview on the actual lab, it does whats intended, but I still get it as a wrong answer. I have also tried doing it on a different browser and it gives me the same error message. Please help me out someone so I can move n from this assignment finally lol. Ill post my HTML/CSS down below if that helps anybody!!
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>Job Application Form</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="container">
<form>
<label for="name">First Name: </label>
<input type="text" id="name" placeholder="E.g., John Smith">
<br>
<label for="email">Email Address: <label>
<input type="email" id="email" placeholder="example@mail.com">
<br>
<label for="position"> Select Position: </label>
<select id="position" name="position">
<option value="face-seat"> Face Seat</option>
<option value="submissive"> Sub </option>
<option value="Dom"> Str8 Dom</option>
</select>
<legend>State availability</legend>
<fieldset class="radio-group" name="availability">
<input type="radio" name="availability" id="full-time">
<label for="full-time">Full-time</label>
<input type="radio" name="availability" id="part-time">
<label for="part-time">Part-time</label>
<input type="radio" name="availability" id="full-time">
<label for="casual">Casual</label>
</fieldset>
<textarea id="message">
</textarea>
<br>
<button type="submit"> Submit</button>
</form>
</div>
</body>
</html>
/* file: styles.css */
input select textarea:invalid{
border-color:red;
}
input select textarea:valid{
border-color:green;
}
button:hover{
background-color: purple;
}
.radio-group input[type="radio"]{
border-color:orange;
background-color: green;
box-shadow: inset 10 20;
}
input[type="radio"] + label{
color: blue;
}
input:first-of-type{
border-radius: 15px;
}
input:focus,textarea:focus{
border-color: pink;
outline: none;
}
input:invalid, select:invalid,textarea:invalid{
border-color: red;
}
input:valid,select:valid,textarea:valid{
border-color: green;
}
.radio-group input[type="radio"]:checked {
border-color: #3b82f6;
background-color: orange;
box-shadow: 5px 10px;
}
.radio-group input[type="radio"]:checked + label {
color: orange;
}
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:151.0) Gecko/20100101 Firefox/151.0
Challenge Information:
Build a Job Application Form - Build a Job Application Form