Responsive Web Design - Survey Form

Hello there fellow campers,

I just finished this FCC Survey Form project and I would love to listen to your feedback and/or advice.

Thank you!

You can view the project is here - https://codepen.io/sriranga24/pen/bGeQBOG

2 Likes

Looks good. The submit button colour is very bright againt the white text and will be hard to read for many people. I would adjust it.

3 Likes

I’m going to go further and say that the white text on that background is hard to read.

A few other things:

  • The label for the Age input is not working properly because the for attribute does not point to the id on input.
  • You need a label for the Destination select, features select, and comments textarea.
  • At larger text sizes the inputs start to break out of the form container. The issue is the max-width you have set on div.container. You should probably use em units so that it is responsive to changes in text size.
  • You don’t want to use <br> to create vertical space. Any vertical space should be created using CSS. So yank all of those <br>s.
1 Like

Looks great! I like the background image you used.
One thing I noticed is that the input area for age is not wide enough to fit placeholder text. I’d just leave it blank.

Thank you so much for this one. I’ll change it.

Thanks a lot for the detailed feedback @bbsmooth. There were some problems with the
before I added too. I’ll change it asap.