Survey Form - Build a Survey Form

HTML-CSS
1

Tell us what’s happening: something wrong with my code and the comments as well

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> 

		< ! - - description - - >
		<p id=“description”>Thank you for taking the time to help us improve the platform</p>

		<! - - user input - ->

		<form id=“survey-form”  action=“/submit” method=“post”>

		<fieldset>
		<label for=“name-label”>Name: <input id=“name” name=“name” type=“text” placeholder=“Enter your name” required /></label>
		<label for=“email-label”>Email: <input id=“email” name=“email” type=“email”  placeholder=“Enter your email” required /></label>
		<label for=“number-label”>Number: <input id=“number” type=“number” name=“number” placeholder=“Enter your number” min=“0000000000” max=“9999999999” /><\label>
		</fieldset>

		<! - - options drop down - ->

		<fieldset>
		<label for=“dropdown”>How did you hear about this survey:
		<select id=“dropdown” name=“dropdown”>
		<option value=“1”>LinkedIn</option>
		<option value=“2”>freeCodeCamp</option>

		</select>
		</label>

		<! - - radio buttons - - >
		
		<fieldset>
		<legend>Do you like Coding<legend>
		<label for=“yes-label”><input id=“yes-label” type=“radio” name=“yes-label” value=“yesValue” /> Yes</label>
		<label for=“no-label”><input id=“no-label” type=“radio” name=“no-label” value=“noValue” /> No</label>
		</fieldset>

		<fieldset>
		<legend>Would you recommend CodeCamp to a friend<legend>
		<label for=“absolutely-label”><input id=“absolutely-label” type=“radio” name=“absolutely-label” value=“absolutelyValue” /> Absolutely </label>
		<label for=“notsure-label”><input id=“notsure-label” type=“radio” name=“notsure-label” value=“notsureValue” />  Not Sure</label>
		</fieldset>

          <! - - check boxes- - >

		<fieldset>
		<legend>What kind of career do see yourself in coding<legend>
		<label for=“software”><input id=“software” type=“checkbox” name=“checkboxGroup” value=“softwareValue” /> Software Engineer</label>
		<label for=“java”><input id=“java” type=“checkbox” name=“checkboxGroup” value=“javaValue” /> Java Developer</label>
		</fieldset>

		<! - - text area - ->

		<label for=“suggestions”>Any suggestions ?
			<textarea id=“suggestions” name=“suggestions” rows=“5” cols=“40”></textarea>
		</label>

		<! -- submit input-->
		<input id=“submit” type=“submit” value=“submit” />
		

		
	


		</form>
	</body>
</html>

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

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

form {
  width: 60vw;
  max-width: 500px;
  min-width: 300px;
  margin: 0 auto;
  padding-bottom: 2em;
}

fieldset {
  border: none;
  padding: 2rem 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;
}


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;
}

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.6 Safari/605.1.15

Challenge Information:

Survey Form - Build a Survey Form

2

have a look at the 3rd label in the fieldset again. There is something wrong.

3

The correct comment syntax should be this

<!-- comment goes inside here -->

once you fix that, then your comments won’t show up on the page

1 Like
5

I see it thank you so much !

1 Like
6

Thank you so much , I will!!!

7

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