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"></html>
<head>
  <meta charset="UTF-8">
  <title>Yusuf CodeCamp Survey Form</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <h1 id="title">Yusuf CodeCamp Survey Form</h1>
  <p id="description">Thank you for taking the time us help us improve the platform<p>
  <form id="survey-form">
    <fieldset>
      <label id="name-label">Name <input id="name" type="text" required placeholder="Enter your name" /></label>
      <label id="email-label">Email <input id="email" type="email" required placeholder="Enter your Email" /> </label>
      <label id="number-label">Age (optional) <input id="number" type="number" required placeholder="Age" min="17" max="100" pattern="[0-9]+" /></label>
      <label>Which option best describes your current role?
        <select id="dropdown">
          <option value="">Select current role</option>
          <option value="1">Full Time Job</option>
          <option value="2"> Full Time Learner</option>
          <option value="3">Student</option>
          <option value="4">Prefer not to say</option>
          <option value="5">Other</option>
      </label>
      <label id="recommend">Would you recommend freeCodeCamp to a friend?</label>
      <label><input type="radio" name="recommend" value="" class="inline" /> Definitely</label>
      <label for="definitely"><input id="definitely" type="radio" name="maybe" value="maybe" class="inline" /> Maybe</label>
      <label><input type="radio" name="not-sure" value="not-sure" class="inline" /> Not sure</label>
    
    
      <label>What is your favourite feature of Yusuf CodeCamp
        <select id="dropdown">
          <option value="">Select an option</option>
          <option value="1">Challenges</option>
          <option value="2">Projects</option>
          <option value="3">Community</option>
          <option value="4">Open Source</option>
      </label>
      <label>What would you like to see improved (check all that apply)</label>
      <label><input type="checkbox"</label>
  </fieldset>
  </form>



    

/* file: styles.css */
body {
  width: 100%;
  height: 100vh;
  margin: 0;
  background-color: #2b3b30;
  color: #f5f6f7;
  font-family: fantasy;
  font-size: 16px;
}
h1, p {
  margin: 1em auto;
  text-align: center;
}
p {
  margin: 1em auto;
  text-align: center;
  font-style: italic;
}
form {
  width: 90vh;
  max-width: 500px;
  min-width: 300px;
  margin: 0 auto;
}
fieldset {
  border-radius: 4px;
  border-bottom: 3px solid #3b3b4f;
}
fieldset:last-of-type {
  border-bottom: none;
}

label {
  display: block;
  padding: 1rem 0;
}
input, select {
  width: 90vh;
  max-width: 500px;
  min-width: 300px;
  height: 35;
  border-radius: 7px;
  margin: 10px 0 0 0;
}
inline {
  width: unset;
  margin: 0 0.5rem 0 0 0;
}
input[type=""] {

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 Safari/537.36

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

2

Do you have any questions about the above-posted code?

3

yes i’ve been having issues with the radio buttons and checkbox.

4

hi there, welcome to the forum.

edit: oops I just realised this is a project.

What is the issue you need help with?
(you said you have an issue but you didn’t specify what it was)

5

I am having problem with the radio buttons and checkboxes. I use the think the problem is coming from the css because there doesn’t seem to be an
y problem with the html. One more thing is the question that comes before the radio buttons doesn’t seem to appear.

6

I am still unsure what is the problem you need help with.

With respect to the question not showing up, usually that happens if there is a syntax error in the html.
I suggest you use the following html validator (paste your html into it) and it will report to you all the errors it finds.
Fix them all and that may fix the problem with the missing question

7

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