Survey Form - Build a Survey Form

HTML-CSS
1

my html code-

survey form

freecodecamp survey form

thank you for taking time the time to help us to improve the platform

Name
email
Age(optional)
Which option best describes your current role?
Would you recommend freeCodeCamp to a friend?
Definitely
maybe
Not sure
What is your favorite feature of freeCodeCamp?
What would you like to see improved? (Check all that apply)
<input type="checkbox" name="improvement" value="1" Front-end Projects
<input type="checkbox" name="improvement" value="2" back-end Projects
<input type="checkbox" name="improvement" value="3" Data Visualization
<input type="checkbox" name="improvement" value="4" challenges
<input type="checkbox" name="improvement" value="5" open source community
<input type="checkbox" name="improvement" value="6" Gitter help rooms
<input type="checkbox" name="improvement" value="7" Gitter help rooms

Any comments or suggestions?

my css code-
body{
font-family:‘poppins’,sans-sarif;
background-image: linear-gradient( 115deg, rgba(58, 58, 158, 0.8), rgba(136, 136, 206, 0.7) ), url(https://cdn.freecodecamp.org/testable-projects-fcc/images/survey-form-background.jpeg);
background-repeat: no-repeat;
background-size: cover;
background-position:center;
width:100vw;
color:white;
margin:0;
}
#title{
margin-top:30px;
text-align:center;
margin-bottom:5px;
font-weight:400;
}
#description{
margin-top:0;
text-align:center;
font-style:italic;
}
#survey-form{
background-color:rgba(27,27,50,0.8);
width:80%;
margin:0 auto 0 auto;
border-radius:10px;
max-width:800px;
min-width:500px;
}
.form-div{
display:flex;
flex-direction: column;
justify-content:center;
align-items:center;
margin:0 auto 1.25rem auto;
padding:0.25rem;
}
label{
margin-bottom:10px;
width:90%;
font-size:18px;
padding-top:8px;
}
input, select {
width:90%;
height:40px;
border-radius:5px;
font-size:16px;
}
textarea{
height:100px;
width:90%;
font-size:16px;

}
input[type=“radio”],input[type=“checkbox”]{
height:20px;
margin-left:20px;
width:10%;
}
.form-radio,.div-checkbox{
display:flex;
flex-direction:row;
align-items:center;
padding-bottom:5px;
}
input[type=“submit”]{
width:90%
color:white;
background-color:green;
border:1px solid green;
margin-bottom: 50px;
}

2

Hello.

Advice: for future post with issues, click the Ask for Help button located on the challenge (it looks like a question mark). This button only appears if you have tried to submit an answer at least three times.

Check all your input elements. You not close (>) them.

Grets.

1 Like
3

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