Survey Form - Build a Survey Form

HTML-CSS
1

Tell us what’s happening:

For every radio button group I have to insert 2 radio buttons, of which I have done. Please make me understand.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Survey Form</title> <link rel="stylesheet" href="styles.css">
    </head> 
  <body>
    <h1 id="title">Survey Form</h1>
    <p id="description">Please fill out this form in order to help us improve our services, thank you.</p>
    <form id="survey-form" method="post" action="https://survey-form.freecodecamp.rocks/">
      <fieldset>
        <label for="name" id="name-label">Enter Your Name: <input id="name" type="text" name="name" required="" placeholder="Type your Full Name."></input></label>
        <label for="email" id="email-label">Enter Your Email: <input id="email" type="email" name="email" placeholder="Type your email." required=""></input></label>
        <label for="number" id="number-label">Enter Your Number: <input id="number" type="number" pattern="[0-9]" min="13" max="100" name="number" placeholder="Type your cell number."></input></label>
      </fieldset>
  <fieldset>    
    <label for="dropdown">How often do you shop at our store?
      <select id="dropdown" name="options">
        <option value="">(select one)</option>
        <option value="1">Once a month</option>
        <option value="2">Twice a month</option>
      </select>
      </label> </fieldset>
      <fieldset id="group1">
        <legend>Which pastry products do you like?</legend>
        <label for="muffins"><input id="muffins" type="radio" value="1" name="muffins" checked></input>Muffins</label>
        <label for="cookies"><input id="cookies" type="radio" value="2" name="cookies"></input>Cookies</label>
      </fieldset>
      <fieldset id="group2">
        <legend>Which drink/s do you like?</legend>
        <label for="soft-drinks"><input id="soft-drinks" type="radio" value="1" checked name="soft-drinks">Soft Drinks</input></label>
        <label for="coffee"><input id="coffee" type="radio" value="2" name="coffee">Coffee</input></label>
      </fieldset>
      <fieldset>
        <label for="feedback">Provide us with feedback regarding our staff's customer service:
          <textarea id="feedback" rows="4" cols="35" placeholder="What I like or dislike about the service provided..." name="feedback"></textarea
          <label>
      </fieldset>
      <label for="mail-subscription">
        <input id="mail-subscription" type="checkbox" value="1" required> Would you like to get emails from our store</input>
      </label>
      <label for="terms-and-conditions">
        <input id="terms-and-conditions" type="checkbox" value="2" required name="terms-and-conditions" class="inline">I accept the <a href="https://survey-form.freecodecamp.rocks/">terms and conditions</a></input>
      </label>
      <input id="submit" type="submit" value="submit"></input>
      </form> 
  </body>
</html>

/* file: styles.css */
body {width: 100%; height: 100vh; margin: 0; background-color: #1b1b32; color: #f5f6f7}

Your browser information:

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

Challenge Information:

Survey Form - Build a Survey Form

2

HI there! Check this requirement:

  1. Inside the form element, you can select an option from a group of at least two radio buttons that are grouped using the name attribute

You have different values of your name attributes

1 Like