Build a Job Application Form - Build a Job Application Form

HTML-CSS
1

Tell us what’s happening:

Hi, all. I’ve scoured the related help posts but can’t seem to find a resolution.

  1. You should use the :checked pseudo-class on .radio-group input[type=“radio”] to add a border color, background color and a box shadow when the radio button is selected.

I’m not sure if it’s just something that I’m not understanding. Thanks for your help!

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>
    <h1>Job Application</h1>
    <div class="container">
        <form>
            <label>Full Name:
                <input required type="text" id="name">
            </label>

            <label>Email Address:
                <input required type="email" id="email">
            </label>

            <label for="position">Position:</label>
            <select required id="position" name="position">
                <option selected disabled value="select">Select a Position</option>
                <option value="developer">Developer</option>
                <option value="designer">Designer</option>
                <option value="manager">Manager</option>
            </select>
              
            <fieldset class="radio-group">
                <legend>Availability:</legend>
                <input type="radio" id="full-time" name="availability" required>
                <label for="full-time">Full-time</label>
                <input type="radio" id="part-time" name="availability">
                <label for="part-time">Part-time</label>
            </fieldset>

            <label>Why do you want this job?</label>
            <textarea
            required
            label="message"
            id="message"
            name="message"
            rows="5"
            cols="75">
            Write your motivation
            </textarea>

            <button type="submit">Submit Form</button>

        </form>
</body>
</html>

/* file: styles.css */
input:focus, textarea:focus {
  border-color: brown;
}


input:invalid, select:invalid, textarea:invalid {
  border-color: red;
}

input:valid, select:valid, textarea:valid {
  border-color: green;
}

button:hover {
  background-color: yellow;
}

.radio-group input[type="radio"]:checked {
  border-color: green;
  background-color: green;
  box-shadow: gray;
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:137.0) Gecko/20100101 Firefox/137.0

Challenge Information:

Build a Job Application Form - Build a Job Application Form

2

you should check on that

3

Oh, duh. Thanks for your help!