Survey Form - Build a Survey Form

Tell us what’s happening:

I finished my project, but every step shows an icon of a chemistry flask?
Does anyone know what to do? It is like this for hours :confused:

Your code so far

<!-- file: index.html -->
<!DOCTYPE HTML>
<html>
  <body>
    <link rel="stylesheet" href="styles.css" />
    <h1 id="title">Formulário do Rodrigo</h1>
    <p id="description">Me ajude a aprender mais HTML</p>
    <head>
      <form id="survey-form">
        <label id="name-label" for="name"> Name</label> 
          <input placeholder="Seu nome" 
                 id="name" 
                 type="text" 
                 required></input>
        <label id="email-label" for="email"> Email</label>
        <input placeholder="e-mail" 
               id="email" 
               type="email" 
               required></input>
        <label id="number-label" for="number"> Número</label>
        <input placeholder="número" 
               id="number" 
               type="number" 
               pattern="[0-9]" 
               min="13" 
               max="120" />
        <select id="dropdown">
          <option value="">Select One</option>
          <option value="1">Selecione esse</option>
        <input name="option-1" 
               type="radio" 
               value="1"
               checked>Option 1</input>
        <input name="option-2"
               value="2"
               type="radio">Option 2</input>
       <input name="option-3" 
               type="radio" 
               value="3">Option 4</input>
       <input name="option-4" 
               type="radio" 
               value="4">Option 3</input>
        <input type="checkbox"
               value="esse">Esse</input>
        <input type="checkbox"
               value="aquele">Aquele</input>
        <textarea placeholder="Quem é você?"></textarea>
        <button id="submit" type="submit">Enviar</button>
      </form>
    </head>  
  </body>
</html>
/* file: styles.css */
body {
  width: 100%;
  height: 100vh;
  margin: 0;
}

h1, p {
  text-align: center;
}

form {
  width: 60vw;
  max-width: 500px;
  min-width: 300px;
  margin: 0 auto;
  padding-bottom: 2em;
}

label {
  display: block;
}

input {
  display: block;
  margin-bottom: 2px;
}

input[type="checkbox"] {
  display: inline;
}

input[type="radio"] {
  display: inline;
}

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.1.2 Safari/605.1.15

Challenge Information:

Survey Form - Build a Survey Form

Hello!

Try adding names to the radio input. Place the same name in each group.

<input  id="good" type="radio" name="choice">

I would enter that name is my radio buttons in the group for
So if all of your radio buttons are in one group where only one can be chosen, give all of them the same name.

This prevents more than one choice.

Did you click run the tests button?

1 Like

Hey there!
Yes, my radio groups have all the 3 attributes. Very wired.

I did, several times. The first times it was running ok, but then it stopped.

I ran your code, and you are still failing this step

“Every radio button group should have at least 2 radio buttons.”

Have you made any changes to pass this step?

Probably not done correctly… I’ll give it another shot. Thanks mate :slight_smile:

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