Survey Form - Build a Survey Form

Tell us what’s happening:

hi guys, can anybody check my codes and tell me where is the problem is?
i really dont find any clue here, please :cry:

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>Survey Form</title>
  </head>
  <body>
    <h1 id="title">Platform Survey Form</h1>
    <p id="description">Thank you for taking the time to help us improve the platform</p>
    <form id="survey-form">
    <fieldset id="dropdown"><article>
      <label id="name-label">Name
    <input id="name" type="text" name="survey-form" placeholder="Enter your name" required /></label>
    </article>
    <article>
      <label id="email-label">Email
    <input id="email" type="email" name="survey-form" placeholder="Enter your email" required /></label>
    </article>
    <article>
      <label id="number-label">Age<legend class="inline">(Optional)</legend><input id="number" name="survey-form" type="number" min="13" max="120" placeholder="Age" class="inline" /></label>
    </article>
    <article>
    <label id="dropdown">Which option best describes your current role?
    <select id="dropdown" value="dropdown">
      <option value="" id="dropdown">select what you choose?</option>
     <option value="1" id="dropdown">student</option>
     <option value="2" id="dropdown">Full time job</option>
     <option value="3" id="dropdown">Freelance</option>
     <option value="4" id="dropdown">other</option>
     </select></article></fieldset>
     <fieldset id="dropdown">
     <article>Do you like our plateform?</article>
      <label for="maybe"><input id="maybe" type="radio" value="maybe" name="referrer" class="inline"/>Maybe</label>
      <label for="definetely"><input id="definetely" type="radio" value="definetely"name="referrer" class="inline"/>Definetely</label>
      <label for="not-sure"><input id="not-sure" type="radio" name="referrer" class="inline" value="not-sure"/>Not Sure</label></fieldset>
<fieldset id="dropdown">
<article>What You like or dislike about us?<legend>(you can choose more than one)</article>
<label for="submit"><input id="submit" type="checkbox"value="survey-form" name="referrer" class="inline"/>not usefull</label>
<label for="submit"><input id="submit" type="checkbox" name="referrer" value="survey-form" class="inline"/>Usefull</label>
<label for="submit"><input id="submit" value="survey-form" type="checkbox" name="referrer" class="inline"/>So So</label>
<label for="submit"><input id="submit" type="checkbox" value="survey-form" name="referrer" class="inline"/>Vey usefull</label>
<label for="submit"><input id="submit" type="checkbox" name="referrer" value="survey-form" class="inline"/>YOU ARE PERFECT</label></fieldset>
<label>Any other comment for us?
  <textarea id="comment" name="comment" rows="5" cols="40" ></textarea>
</label>

  <input type="submit"></input>
     </article>
  </body>
</html>
/* file: styles.css */
body{
  widht:100%;
  height: 100vh;
  margin: 0;
  background-color: cyan;
  color:navy;
  font-family: Arial;
  font-size:16px;
  
}
h1,p {
  margin: auto;
  text-align:center;
}
form {
  width:70vw;
  max-width:500px;
  min-width:300px;
  margin: 2em auto
  padding-bottom:2em;
}
label {
  display:block;
  margin: 1rem;
}
textarea,select {
  background-color:skyblue;
  border:1px solid navy;
  margin:0 0 0 0 ;
  width: 100%;
  min-height: 2em;
}
input[type="submit"] {
  display: block;
  width: 60%;
  margin: 1em auto;
  height: 2em;
  font-size: 1.1rem;
  background-color: #skublue;
  border-color: white;
  min-width: 300px;
}
input {
  padding:2px;
  margin: 2 2 2 2;
}
fieldset {
  padding:2px
  border-bottom: 3px solid #3b3b4f;
border: none;
}
.inline {
  width: unset;
  margin: 0 0.5em 0 0;
  vertical-align: middle;

Your browser information:

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

Challenge Information:

Survey Form - Build a Survey Form

What errors are you seeing?

so there is 2 problem need to fix, its

  • You should have a #select field with an id of dropdown .
  • Your #submit should have a type of submit .

but i think i have do it all. is there any problem with that area that i miss?

Where is the #select? You need to actually create that id. Same for submit.

The id attribute value should be unique.

You should only have one of each value. The test will select the first it finds and if that id is not on the correct element it will fail the test.

For example, you have multiple dropdown and submit ids.

1 Like

thank you, it really help me alot. im finish it :blush:

1 Like