Survey Form - Build a Survey Form

HTML-CSS
1

Tell us what’s happening:
I dont know what my mistake is. I looked it over multiple times and cant find it.

  **Your code so far**

/* file: index.html */
<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="styles.css">
  <title>
    Survey Form
  </title>
  <h1 id="title">
    Survey Form
  <h1>
</head>
<body>
  <p id="description">
    This is a Survey Form for the Responsive Web Design of freeCodeCamp (The font is just for my amusement)
  </p>
  <form id="survey-form" action="">
    <fieldset>
      <label id="name-label">Enter Your Name:<input id="name" type="text" placeholder="John Smith" required></label>
      <label id="email-label">Enter Your Email:<input id="email" type="email" placeholder="example@email.com" required></label>
      <label id="number-label">Enter a Number (10-120):<input id="number" type="number" min="10" max="120" placeholder="10-120" required></label>
    </fieldset>
    <fieldset>
      <select id="dropdown">
        <option value="">Select an Option</option>
        <option value="1">Option 1</option>
        <option value="2">Option 2</option>
      </select>
      <label><input type="radio" class="inline" name="radio1-2">Radio-1</label>
      <label><input type="radio" class="inline" name="radio1-2">Radio-2</label>
    </fieldset>
    <fieldset>
      <label><input type="checkbox" class="inline" value="checkbox-1">Checkbox-1</label>
      <label><input type="checkbox" class="inline" value="checkbox-2">Checkbox-2</label>
      <label>Additional comments:
        <textarea placeholder="additional comments"></textarea>
      </label>
    </fieldset>
    <input id="submit" type="submit" value="Submit">
  </form>
</body>
</html>

/* file: styles.css */
html {
font-family: papyrus;
}

h1 {
font-size: 40px;
text-align: center;
}

body {
width: 100%;
}

p {
font-size: 12px;
text-align: center;
}

label {
font-size: 14px;
display: block;
margin: 15px 0px 0px 0px;
text-align: left;
}

fieldset {
max-width: 500px;
margin: auto;
border: none;
border-bottom: 2px solid rgb(104, 101, 101);
}

input, select, textarea {
width: 100%;
height: 25px;
background-color: rgb(67, 66, 66);
border: 1px solid rgb(67, 66, 66);
}

input[type="submit"] {
width: 150px;
margin-top: 20px;
}

.inline {
width: unset;
vertical-align: middle;
margin: 0 10px 0 0;
}

  **Your browser information:**

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

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

2

what is that you are trying to do? what do the tests say?

3

I have to make a Survey. The Survey has to have a h1 element, a p element, input for text, input for email, input for number, labels for the last three inputs, a select field with at least 2 selectible option elements, at least 2 input elements with the type of radio and a value and name and a group should have at least 2 radio buttons, 2 checkboxes with a value, a textarea element and a submit button.

4

are you failing all those tests?

try putting the h1 in the body instead of in the head

5

I found my problem. I forgot to give the Radio a value.

6

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