Build a Job Application Form - Build a Job Application Form

HTML-CSS
1

Tell us what’s happening:

what should I do right to help code 17 and 18 pass
?

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 href="styles.css"rel="stylesheet">
    <title>Job Application Form</title>
    <h1>Job Application form</h1>
</head>
<body class="body">
<div class="container">
    <form>
        <label for="full-name" id="name">Full Name:</label><br>
        <input type="text" id="name" class="input" placeholder="John-Doe" ><br>
  <label for="email" id="email">Email:</label><br>
  <input type="email" id="email" class="input" placeholder="example@gmail.com"><br>
  <label type="position" id="post">Position:</label><br>
  <select name="position" id="position"</select>
  <option value="select">Select an option</option>
  <option value="Developer">Developer</option>
  <option value="design">Designer</option>
  <option value="manage">Manager</option>
  </select>
  <fieldset class="radio-group">
      <legend>Availability:</legend>
      <input type="radio" id="time" name="availability" class="radio-buttons">
      <label type="full-time" id="full-time" class="label">Full Time</label>
      <input type="radio" id="part" name="availability" class="radio-buttons">
      <label type="part-time" id="part" class="label">Part Time</label>
      </fieldset>
      <label type="reason" id="reason">Why do You Want This Job</label> 
      <textarea id="message" class="textarea">
          </textarea><br>
          <button type="submit">Submit</button>
    </div>
</body>
</html>

/* file: styles.css */
body{
  font-family: sans-serif;
  margin: 0;
  padding: 0;
  background-color: rgb(208, 208, 228)
}
container{
  padding: 5px 0px;
  margin: 5px 10px  
}
input:focus, textarea:focus{
  outline: important;
  border: 3px solid rgb(122, 122, 64);
  outline: none;
}
input:invalid, select:invalid, textarea:invalid{
border: 3px solid red;
}
input:valid, select:valid, textarea:valid{
  border: 3px solid green;
}
button:hover{
  background-color: rgb(181, 216, 181);
}
.radio-group input[type="radio"]:checked{
  border: rgba(0, 128, 0, 0.473);
  background-color: rgb(230, 240, 230);
  box-shadow: 4px 6px rgb(63, 80, 63);
  color: #fff;
}
input:nth-child(1){
 border-radius: 3px; 
}
input{
  padding: 5px 90px;
  margin: 5px 5px
}
radio-group:checked {
  color: green;
}
label:checked{
  color: green;
}
.container input:first-child{
  background-color: yellow;
}
.radio-button:checked {
  color: rgb(33, 48, 33);
}

Your browser information:

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/136.0.0.0 Safari/537.36

Challenge Information:

Build a Job Application Form - Build a Job Application Form

2

Can a label ever be checked?

Is this a valid way to associate a label element with an input element?

Is there an element with this class in your code?

3

hi, thank you for taking out time to help me on this
I have tried reviewing everything you asked but the codes still aren’t passing

4

Please post your updated code.

5

I’m sorry I didn’t download my solution

6

Did you complete this lab then?

7

yes, I did
I googled the codes that weren’t passing