Survey Form - Build a Survey Form

HTML-CSS
1

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

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <h1 id="title">freeCodeCamp Survey Form</h1>
    <p id="description">Thank you for taking the time to help us improve the platform</p>
    <form action="" id="survey-form">
        <label for="name" id="name-label">Name</label>
        <input type="text" id="name" placeholder="Enter your name" required>
        <label for="email" id="email-label">Email</label>
        <input type="email" id="email" placeholder="Enter your email" required>
        <label for="age" id="number-label">Age
(optional)</label>
        <input type="number" min="9" max="120" id="number"  placeholder="Age"required>
        <label>
          Which option best describes your current role?
          <select name="dropdown" id="dropdown">
            <option value="">"Select current role"</option>
            <option value="">Student</option>
            <option value="">Full Time Job</option>
            <option value="">Full Time Learner</option>
            <option value="">Prefer not to say</option>
            <option value="">Other</option>
          </select>
        </label>
        <label for="">Would you recommend freeCodeCamp to a friend?
        </label>
        <input class="white"type="radio" name="radio" value="Definitely" >Definitely
        <input type="radio" name="radio" value="May be">May be
        <input type="radio" name="radio" value="Not sure">Not sure
        <label for="">What is your favorite feature of freeCodeCamp?</label>
        <select name="" id="">
           <option value="">Select an option</option>
           <option value="">Challenges</option>
           <option value="">Projects</option>
           <option value="">Community</option>
           <option value="">Open Source</option></select>
           <label for="">What would you like to see improved? (Check all that apply)</label>
           <input type="checkbox" Value="Front-end Projects">Front-end Projects
           <input type="checkbox" Value="Back-end Projects">Back-end Projects
           <input type="checkbox" Value="Data Visualization">Data Visualization
           <input type="checkbox" Value="Challenges">Challenges
           <input type="checkbox" Value="Open Source Community">Open Source Community
           <input type="checkbox" Value="Gitter help rooms">Gitter help rooms
           <input type="checkbox" Value="Videos">Videos
           <input type="checkbox" Value="City Meetups">City Meetups
           <input type="checkbox" Value="Wiki">Wiki
           <input type="checkbox" Value="Forum">Forum
           <input type="checkbox" Value="Additional Courses">Additional Courses
          <label for="">Any comments or suggestions?</label>
           <textarea name="" id="" cols="50" rows="10" placeholder="Enter your comment here..." ></textarea>
           <input type="submit" id="submit">
    </form>
</body>
</html>

/* file: styles.css */
body{
  margin: 0 auto;
  
}
form{
  background-color:252644;
}
label,input{
  display:block;
   color:white;
}
input[type="radio"]{
  color:white;
}
.white{
  color:white;
}

Your browser information:

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

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

2

Please Tell us what’s happening in your own words.

Learning to describe problems is hard, but it is an important part of learning how to code.

Also, the more you say, the more we can help!

3

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