Survey Form - Build a Survey Form

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.

This is the only error I’m getting " * Failed:Every radio button group should have at least 2 radio buttons." Don’t know what i missed out, can anyone help?

Your code so far

<!-- file: index.html -->
<link rel="stylesheet" href="styles.css">
<h1 id="title">Ways to improve user experience on Netflix</h1>
<p id="description">Massive gratitude for taking out time to help us improve user experience</p>

<form id="survey-form">
  <div class="input-element">
  <label id="name-label">
    Name
    <input placeholder="name" id="name" type="text" required/>
  </label>
  </div>
   <div class="input-element">
  <label id="email-label">
    Email
    <input placeholder="email" id="email" type="email" required/>
  </label>
  </div>
   <div class="input-element">
  <label id="number-label">
    Age
    <input placeholder="age" id="number" type="number" min="5" max="100" required/>
  </label>
  </div>
  <div class="input-element">
  <label id="select-label">
    What's your favorite feature?
    <input placeholder="age" id="age" type="number" required/>
  </label>
  <select id="dropdown">
    <option>Multiple accounts</option>
    <option>Sharing option</option>
    <option>Varying genres</option>
  </select>
  </div>
  <div class="input-element">
    <label>Have you used Netflix before?</label>
    <div>
    <label><input type="radio" name="yes" value="yes"/>Yes</label>
    </div>
    <div>
    <label><input type="radio" name="no" value="no"/>No</label>
    </div>
    </div>
    <div>
    <label>Which suggestion do you have for Netflix?</label>
    <div>
    <label>Screenshot screen<input type="checkbox" name="ideas" value="screenshot"/></label>
    </div>
    <div>
    <label>Cheaper subscriptions<input type="checkbox" name="ideas" value="subscription"/></label>
    </div>
     <label>Sharing live stream<input type="checkbox" name="ideas" value="sharing"/></label>
    </div>
     <label>More download space<input type="checkbox" name="ideas" value="space"/></label>
    </div>
    </div>
    <div class="input-element">
      <label>Additional comments</label>
      <textarea type="text"></textarea>
      </div>
      <button type="submit" id="submit">Submit</button>
</form>

/* file: styles.css */
body{
  background-color: rgb(200, 0, 0);
  text-align: center;
}

form {
  max-width: 500px;
  text-align: left;
  padding: 20px;
  border: 2px solid black;
  border-radius: 10px;
}

input {
  padding: 5px;
  border: none;
  border-radius: 5px;
}
.input-element {
  display: flex;
  flex-direction: column;
   margin: 10px;
}

select{
  padding: 5px;
  border: none;
  border-radius: 5px;
}

input[type="checkbox"] {
  width: 15px;
  height: 20px;
}

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 Safari/537.36

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

2

this here should be one group of radio buttons because you want the user to answer either yes or not but not both, correct?
Therefore, make the two radio buttons have the exact same name attribute value to group them as one set.

3

Just figured the solution, thank you

1 Like
4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.