It won’t let me write my code on the page. I did it in Visual Studio Code but it won’t let me transfer it to the page. Help!!!
<!-- file: index.html -->
/* file: styles.css */
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36
Survey Form - Build a Survey Form
I guess you re trying to copy and past the code? It should work.
What happens when you try
I don’t know where I have to paste it to my code.
I was able to send it, I had to pay for it from F12 and I could.
But now I get errors that I don’t understand why, if I did everything the instructions ask for.
<h1 id="title">Formulario Laboral</h1>
<p id="description">Estamos buscando empleados para la Empresa MaxPower cuentanos un poco de vos.</p>
<form id="survey-form" action="">
<h2>Formulario de Contacto</h2>
<!-- SIMPLE INPUTS -->
<fieldset>
<legend> INFORMACION BASICA</legend>
<div class="form_input">
<label for="name-label">Nombre Completo</label>
<input type="text" name="" id="name-label" placeholder="Tu Nombre">
</div>
<div class="form_input">
<label for="number-label">Edad</label>
<input type="number" name="" id="number-label" placeholder="Tu edad" min="18" max="120">
</div>
<div class="form_input">
<label for="email-label">Email</label>
<input type="email" name="" id="email-label" placeholder="@example.com">
</div>
</fieldset>
<!-- SELECT - OPTION - RADIOBUTTOM -->
<fieldset>
<legend> INFORMACION SECUNDARIA</legend>
<div class="form_input">
<label for="">Tipos de Usuario</label>
<select name="type-of-user" id="dropdown">
<option value="user1">Opcion 1</option>
<option value="user2">Opcion 2</option>
<option value="user3">Opcion 3</option>
</select>
</div>
<div class="form_input">
<p>¿Actualmente tenes empleo?</p>
<label for="empleado">
<input class="inline" type="radio" name="option" id="empleado" checked> Empleado
</label>
<label for="desempleado">
<input class="inline" type="radio" name="option" id="desempleado"> Desempleado
</label>
</div>
</fieldset>
<!-- CHECKBOXES -->
<fieldset>
<legend>¿Para que pues to te postulas?</legend>
<div class="form_input">
<label for="camarero">
<input class="inline" type="checkbox" name="" id="camarero" value="camarero"> Camarero/a
</label>
<br>
<label for="jefe-de-cocina">
<input class="inline" type="checkbox" name="" id="jefe-de-cocina" value="jefe-de-cocina"> Jefe de
Cocina
</label>
<br>
<label for="ayudante-de-cocina">
<input class="inline" type="checkbox" name="" id="ayudante-de-cocina" value="ayudante-de-cocina">
Ayudante de
Cocina
</label>
<br>
<label for="cajero">
<input class="inline" type="checkbox" name="" id="cajero" value="cajero"> Cajero
</label>
</div>
</fieldset>
<div class="form_input">
<label for="mensaje">Cuentanos tu experiencia</label>
<textarea name="" rows="7" placeholder="Deja un breve texto con tu experiencia laboral..."
id="mensaje"></textarea>
</div>
<div class="form_input">
<label for="checkbox">Acepto los <a href="#" target="_blank">terminos y condiciones</a></label>
<input type="checkbox" class="checkbox" name="" id="checkbox">
</div>
<div class="form_input">
<input class="inline" type="submit" name="submit" id="" value="Submit">
</div>
</form>
body {
margin: 0;
font-family: sans-serif;
color: #ddd;
background-image: linear-gradient(to top, #0ba360 0%, #3cba92 100%);
}
#title {
text-align: center;
margin: 0;
font-weight: 600;
padding: 10px;
font-size: 2em;
}
#description {
text-align: center;
margin: 0;
font-weight: 100;
font-size: 1.3em;
}
h2 {
text-align: center;
margin: 0;
margin-bottom: 10px;
text-transform: uppercase;
font-weight: 100;
font-size: 1.3em;
padding: 10px;
}
form {
background-color: transparent;
padding: 20px 0;
max-width: 500px;
margin: auto;
box-shadow: 0px 0px 55px #ddd;
margin-top: 50px;
font-size: 16px;
}
.form_input {
padding: 6px 20px;
}
.inline {
width: unset;
vertical-align: middle;
}
input,
textarea,
select {
width: 100%;
box-sizing: border-box;
padding: 6px 12px;
border: none;
border: 1px solid #ddd;
box-shadow: 0px 0px 15px #0003;
background-color: transparent;
border-radius: 8px;
color: #ddd;
}
input::placeholder,
textarea::placeholder {
color: #ddd;
}
option {
background-color: #ddd;
}
textarea {
min-width: 100%;
resize: none;
font-family: sans-serif;
}
label {
font-size: 0.88em;
line-height: 2;
}
.checkbox {
width: auto;
height: 10px;
}
fieldset {
border-radius: 5px;
border: 1px solid #ddd;
padding: 8px 6px 20px 20px;
margin: 20px;
}
legend {
padding: 0 6px;
color: #ddd;
}
a {
color: #69f;
text-decoration: none;
}
What error do you get?
It tells me that I do not comply with:
6. You should have an input element with an id of name.
6. You should have an input element with an id of name.
7. Your #name should have a type of text.
8. Your #name should require input.
9. Your #name should be a descendant of #survey-form.
10. You should have an input element with an email id.
11. Your #email should have a type of email.
12. Your #email should require input.
13. Your #email should be a descendant of #survey-form.
14. You should have an input element with an id of number.
15. Your #number should be a descendant of #survey-form.
16. Your #number should have a type of number.
17. Your #number should have a min attribute with a numeric value.
18. Your #number should have a max attribute with a numeric value.
19. You should have a label element with an id of name-label.
20. You should have a label element with an id of email-label.
21. You should have a label element with an id of number-label.
22. Your #name-label should contain text that describes the input.
23. Your #email-label should contain text that describes the input.
24. Your #number-label should contain text that describes the input.
28. Your #name should have a placeholder attribute and value.
29. Your #email should have a placeholder attribute and value.
30. Your #number should have a placeholder attribute and value.
36. All your radio buttons should have a value attribute and value.
40. All your checkboxes inside #survey-form should have a value attribute and value.
42. You should have an input or button element with an id of submit.
43. Your #submit should have a type of submit.
44. Your #submit should be a descendant of #survey-form.
Hi there!
Create your own topic to the challenge project using the Help button.
I would start here. I could not find an input with id “name” in your code.