Survey-form. a few lines of text aren't showing up for me

for the survey-form a few lines of text won’t show in the project, even though I have completed the project. here’s the html and my css

uh so im not sure how to copy my html without it showing up in html… kinda new here…
how do I copy the raw code?

<!DOCTYPE html>
<html lang="en">
   <head>
    <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title> freeCodeCamp Survey Form
      </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>
  <fieldset>
  <form id="survey-form" method="post">
  <label for="name-label" id="name-label"> Your Full Name: <input id="name" required name="name-label" type="text" placeholder="Your Full Name"></label>
  <label for="email-label" id="email-label"> Your Email: <input id="email" required name="email-label" type="email" placeholder="Your Email"></label>
  <label for="number-label" id="number-label"> Age is optional <input id="number" name="number-label" type="number" min="13" max="140" placeholder="??">
  </label> 
  <label for="dropdown">Which option best describes your current role?</label>
  <select id="dropdown" name="dropdown">
    <option value="">Select Current Role
</option>
    <option value="1">Student
</option>
    <option value="2">Full Time Job
</option>
    <option value="3">Full Time Learner
</option>
    <option value="4">Prefer not to say
</option>
    <option value="5">Other
</option>
<!-- phrase below wont show -->
<p> Would you recommend freeCodeCamp to a friend?</p>
<!-- phrase above wont show -->
<label for="Definitley">
<input id="Definitely" type="radio" name="radio" class="inline" value="radio1">Definintely</label>
<label for="Maybe">
  <input id="Maybe" type="radio" name="radio" class="inline" value="radio2">Maybe
  </label>
  <label for="Not Sure">
    <input id="Nore Sure" type="radio" name="radio" class="inline" value="radio3">Not Sure </label>
<label for="dropdown">What is your favorite feature of freeCodeCamp?</label>
  <select id="dropdown" name="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>
<!-- phrase below wont show -->
<p> What would you like to see improved? (check all that apply)</p>
<!-- phrase above wont show -->
<label for="Front-end Projects"><input name="checkbox" type="checkbox" value="one" class="inline">Front-end Projects</label>
<label for="Back-end Projects"><input name="checkbox" type="checkbox" value="two" class="inline">Back-end Projects</label>
<label for="Data Visualization"><input name="checkbox" type="checkbox" value="three" class="inline">Data Visualization</label>
<label for="Challenges"><input name="checkbox" type="checkbox" value="four" class="inline">Challenges</label>
<label for="Open Source Community"><input name="checkbox" type="checkbox" value="five" class="inline">Open Source Community</label>
<label for="Gitter help rooms"><input name="checkbox" type="checkbox" value="six" class="inline">Gitter help rooms</label>
<label for="Videos"><input name="checkbox" type="checkbox" value="seven" class="inline">Videos</label>
<label for="City Meetups"><input name="checkbox" type="checkbox" value="eight" class="inline">City Meetups</label>
<label for="Wiki"><input name="checkbox" type="checkbox" value="nine" class="inline">Wiki</label>
<label for="Forum"><input name="checkbox" type="checkbox" value="ten" class="inline">Forum</label>
<label for="Additional Courses"><input name="checkbox" type="checkbox" value="eleven" class="inline">Additional Courses</label>
<p>Any comments or suggestions?</p>
<textarea id="text-area" name="text-area" rows="3" cols="30" placeholder="Additional comments..."></textarea>
    <button id="submit" value="submit">Submit</button>
  </form></fieldset>
  </body>
</html>
body {
  width: 100%;
  height: 100vh;
  margin: 0;
  background-color: green;
  color: orange;
  font-family: Tahoma;
  font-size: 16px;
}

h1, p {
  margin: 1em auto;
  text-align: center;
}

form {
  width: 100vw;
  max-width: 600px;
  min-width: 300px;
  margin: 0 auto;
  padding-bottom: 1em;
}

fieldset {
  border: none;
  padding: 1rem 0;
  border-bottom: 3px solid #3b3b4f;
}

fieldset:last-of-type {
  border-bottom: none;
}

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

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

input, textarea {
  background-color: #0a0a23;
  border: 1px solid #0a0a23;
  color: #ffffff;
}

.inline {
  width: unset;
  margin: 0 0.5em 0 0;
  vertical-align: middle;
}

input[type="submit"] {
  display: block;
  width: 60%;
  margin: 1em auto;
  height: 2em;
  font-size: 1.1rem;
  background-color: #3b3b4f;
  border-color: white;
  min-width: 300px;
}

input[type="file"] {
  padding: 1px 2px;
}

// any help would be greatly appreciated. thanks as always.

-DG

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

Those lines aren’t showing because you have html syntax errors.

Both times, you forgot to include closing </select> tags.

When you finish projects, you should run your code through the html validator to check for errors

ty very much I will try that. much appreciated.

omg.

</select>

phew. hours looking at my code and didn’t notice that… thanks!

It happens to all of us

1 Like