Tell us what’s happening:
hi guys, can anybody check my codes and tell me where is the problem is?
i really dont find any clue here, please
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport"content="width=device-width, initial-scale=1.0">
<link href="styles.css" rel="stylesheet">
<title>Survey Form</title>
</head>
<body>
<h1 id="title">Platform Survey Form</h1>
<p id="description">Thank you for taking the time to help us improve the platform</p>
<form id="survey-form">
<fieldset id="dropdown"><article>
<label id="name-label">Name
<input id="name" type="text" name="survey-form" placeholder="Enter your name" required /></label>
</article>
<article>
<label id="email-label">Email
<input id="email" type="email" name="survey-form" placeholder="Enter your email" required /></label>
</article>
<article>
<label id="number-label">Age<legend class="inline">(Optional)</legend><input id="number" name="survey-form" type="number" min="13" max="120" placeholder="Age" class="inline" /></label>
</article>
<article>
<label id="dropdown">Which option best describes your current role?
<select id="dropdown" value="dropdown">
<option value="" id="dropdown">select what you choose?</option>
<option value="1" id="dropdown">student</option>
<option value="2" id="dropdown">Full time job</option>
<option value="3" id="dropdown">Freelance</option>
<option value="4" id="dropdown">other</option>
</select></article></fieldset>
<fieldset id="dropdown">
<article>Do you like our plateform?</article>
<label for="maybe"><input id="maybe" type="radio" value="maybe" name="referrer" class="inline"/>Maybe</label>
<label for="definetely"><input id="definetely" type="radio" value="definetely"name="referrer" class="inline"/>Definetely</label>
<label for="not-sure"><input id="not-sure" type="radio" name="referrer" class="inline" value="not-sure"/>Not Sure</label></fieldset>
<fieldset id="dropdown">
<article>What You like or dislike about us?<legend>(you can choose more than one)</article>
<label for="submit"><input id="submit" type="checkbox"value="survey-form" name="referrer" class="inline"/>not usefull</label>
<label for="submit"><input id="submit" type="checkbox" name="referrer" value="survey-form" class="inline"/>Usefull</label>
<label for="submit"><input id="submit" value="survey-form" type="checkbox" name="referrer" class="inline"/>So So</label>
<label for="submit"><input id="submit" type="checkbox" value="survey-form" name="referrer" class="inline"/>Vey usefull</label>
<label for="submit"><input id="submit" type="checkbox" name="referrer" value="survey-form" class="inline"/>YOU ARE PERFECT</label></fieldset>
<label>Any other comment for us?
<textarea id="comment" name="comment" rows="5" cols="40" ></textarea>
</label>
<input type="submit"></input>
</article>
</body>
</html>
/* file: styles.css */
body{
widht:100%;
height: 100vh;
margin: 0;
background-color: cyan;
color:navy;
font-family: Arial;
font-size:16px;
}
h1,p {
margin: auto;
text-align:center;
}
form {
width:70vw;
max-width:500px;
min-width:300px;
margin: 2em auto
padding-bottom:2em;
}
label {
display:block;
margin: 1rem;
}
textarea,select {
background-color:skyblue;
border:1px solid navy;
margin:0 0 0 0 ;
width: 100%;
min-height: 2em;
}
input[type="submit"] {
display: block;
width: 60%;
margin: 1em auto;
height: 2em;
font-size: 1.1rem;
background-color: #skublue;
border-color: white;
min-width: 300px;
}
input {
padding:2px;
margin: 2 2 2 2;
}
fieldset {
padding:2px
border-bottom: 3px solid #3b3b4f;
border: none;
}
.inline {
width: unset;
margin: 0 0.5em 0 0;
vertical-align: middle;
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/129.0.0.0 Safari/537.36
Challenge Information:
Survey Form - Build a Survey Form