Build a Job Application Form - Build a Job Application Form

HTML-CSS
1

Tell us what’s happening:

honestly dont know what to do now no.14 is still giving the same error no matter what i try

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">
    <link rel="stylesheet" href="styles.css">
    <title>Job Application Form</title>
</head>
<body>
    <div class="container">
        <form>
<label for="name">Full Name:</label><input type="text" id="name" placeholder="John Doe" required>
        
<label for="email">Email:</label><input type="email" id="email" placeholder="123@hnm.com" required name="email">

<label for="position">Position:</label><select id="position" required>
<option id="select" value="">Select position    <option id="developer" value="developer">Developer</option>
    <option id="manager" value="manager">Manager</option>
    <option id="Designer" value="designer">Designer</option>
</select>
<fieldset class="radio-group"><legend>Availability</legend>
<input type="radio" id="full-time" name="availability"/><label for="full-time">Full-time</label>
<input type="radio" id="part-time"  name="availability"/><label for="part-time">Part-time</label>
</fieldset>
<textarea placeholder="write any recomendations" id="message" required rows="5"></textarea>
<button type="submit" id="submit">Submit</button>
        </form>
        </div>

</body>
</html>

/* file: styles.css */
body{font-family:Arial,sans-serif;
margin:0;
padding:0;
background-color:#f9f9f9;}
.container{max-width:400px;
margin:50px auto;
background:#FFFF;
border-radius:8px;
box-shadow:0 4px 6px rgba(0,0,0,0.1);}
input,select,textarea   {margin-bottom:15px;
padding:10px;
border:2px solid #ccc;
border-radius:10px;
font-size:16px;}
input:invalid,select:invalid,textarea:invalid{border-color:red;}
input:valid, select:valid, textarea:valid{border-color:green;}
button:hover{background-color:red;}
input:focus,textarea:focus{border-color:blue;}

radio-group input[type="radio"]:checked {border-color:orange;
color:white;
background-color:grey;
box-shadow:0 0 5px purple;
}
radio-group input[type="radio"]:checked+ label{
  color:green;
}
.radio-group label{font-weight:normal;
cursor:pointer;}
input[type="radio"]:checked + label{color:orange;}
fieldset{border-radius:10px;}
input:nth-child(1){border-radius:10px;}
label{font-weight:bold;
display:block;
margin-bottom:5px;}
input:first-of-type{border-radius:30px;}

Your browser information:

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

Challenge Information:

Build a Job Application Form - Build a Job Application Form

2

What is the error message? Is there a hint?

3

Hi @chris_sompisi

Class selectors start with a .

Happy coding