Survey Form - Build a Survey Form

HTML-CSS
1

Tell us what’s happening:
i am getting this error.

All your checkboxes inside #survey-form should have a value attribute and value.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Service Survey</title>
    <link rel="stylesheets" href="styles.css">
  </head>
    <body>
      <h1 id="title">Taco Bell Survey</h1>
        <p id="description"> Tell us about the service you experienced here at Taco bell </p>
      <form id="survey-form"action='https://register-demo.freecodecamp.org'>
      <fieldset>
        <label id="name-label" for="name">Name</name>
        <input id="name" type="text" placeholder="Enter your name here" required><br>
        <label id="email-label" for="email">Email</label>
        <input id="email" type="email" placeholder="Enter your email here"required><br>
        <label id="number-label" for="number">Age</label>
        <input id="number" type="number" min="0" max="150" placeholder="Enter your age here" required><br>
        </fieldset>
        <fieldset> 
          <label id="Store-label" for="Store">Which Taco Bell location did you eat from?</label><br>
          <input id="greenwood" name="location" type="radio" value="greenwood" required>
          <label id="greenwood-location-label" for="greenwood-location">Greenwood Location</label><br>
         <input id="Conway" name="location" type="radio" value="conway" required>
          <label id="conway-location-label" for="conway location">Conway Location</label>
          </fieldset>
          <fieldset>
          <label id="purchase" for="purchase">What did you purchase?</label>
          <select id="dropdown" name="purchase">
            <option value="select">Select</option>
            <option value="1">Hard Shell Taco</option>
            <option value="2">Soft Shell Taco</option>
            <option value="3">Slushie</option>
            <option value="4">Nacho Fries</option>
            <option value="quesadilla">Quesadilla</option>
            <option value="other">Other</option>
          </select>
            </fieldset>
            <fieldset>
            <label id="satisfaction-level-label" for="satisfaction-level">How satisfied are you with our service?<br> <input value="1" id="highly satisfied" name="satifaction" type="checkbox"></label> <label id="highly-satisfied" for="highly-satisfied">Highly-Satisfied</label><br> <input value="2" id="satisfied" name="satifaction" type="checkbox"> <label id="satisfied" for="satisfied">Satisfied</label><br> <input value="3" id="moderate" name="satifaction" type="checkbox"> <label id="moderate" for="moderate">Moderate</label><br> <input value="4" id="dissatisfied" name="satifaction" type="checkbox"> <label id="highly dissatisfied" for="highly-disatisfied">Highly-Dissatisfied</label><br>
              </fieldset>
          <fieldset>
            <label id="other-comments" for="other-comments">Other Comments</label><br>
            <textarea id="other-comments" placeholder="Enter any remaining comments about your experiance"></textarea>
            </fieldset>
          <fieldset>
            <input id="consent" type="checkbox" required>
            <label id="consent-label" for="consent">I consent to share this information to the public</label>
            </fieldset>
            <fieldset>
              <input id="submit" type="submit" value="Submit">
              </fieldset>
      </form>
    </body>
  </html>


/* file: styles.css */
body {
 width: 100%;
 background:  rgba(192, 47, 47, 0.079);
 height: 100vh;
 margin: 10px;
 color: #423c3c;
 font-family: Tahoma, sans-serif;
}

h1, p {
 color: rgb(193, 58, 58);
 margin: 20px 10px;
 text-align: center;
}

form {
 width: 80vw;
 max-width: 500px;
	min-width: 300px;
 margin: 0 auto;
 padding-bottom: 1em;
 background: rgba(192, 47, 47, 0.079)
}

fieldset {
 border: none;
 padding: 2 rem 0;
}

label {
 display: block;
 margin: 0.5rem 0;
}

input,
textarea,
select {
 margin: 10px 0 0 0;
	width: 100%;
 min-height: 2em;

.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/105.0.0.0 Safari/537.36

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

2

Just trying to understand which step number is this? And what part of the instructions are you having issues with?

3

hello, I’m having a hard time reading your code because it is not properly indented.
You can use a tool to help you auto-indent it (for eg an editor like Atom can do it for you if you have it installed locally) or do it manually.

Usually when posting code on the forum, it is considered good etiquette to post neat code.

thanks for your attention

4

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