Teacher Survey Page - Project Feedback

Hey guys,

Here is my 2nd project under responsive web design - Survey form.

Codepen link - https://codepen.io/Adi188288/pen/OYXOvx

Please go through it and let me know your feedback on how to improve it.

Apart from that I have a small query.

  • I have added a border-bottom when the input element is active. It works fine in firefox. But it does not display in edge browser. I haven’t tried it in chrome or any other web browser yet. I could not figure out the problem. Any help would be great. Thanks.

Update

I have uploaded the survey page in Netlify. The form is functional right now.

Here is the link --> https://reverent-feynman-d82107.netlify.com/

1 Like

@adi188288 your project is looking good. I think you should add the bottom border for the input fields at all times, not just when the field is in focus. It is hard to see where to input the information.

I believe you would need to add the CSS prefix to get the border bottom to work in Edge browser.

1 Like

Hey @brandon_wallace

Thank you for taking your time to review.

I kinda wanted to make it look good. I think I might have gone overboard with it. Anyway I have made the changes you suggested.

I removed the focus pseudo selector and added border-bottom only.

It’s neat and minimalist, I like it

1 Like

Thank you @thetrueseeker

Hi @adi188288, I’d suggest you also;

  • allow users to click on the labels to make a selection, not just the radio button/checkbox
  • change the cursor to a pointer when hovering over the submit button

@adi188288 looking better now.

  • You can add a small downward pointing arrow on the gender dropdown menu so that people will know how that there are more options on the list.
  • You can also align the radio buttons and checkboxes to line up the name and email fields.

@Roma

Will make the suggested changes. Thanks

Sure. Will make the changes. Thanks

@Roma and @brandon_wallace.

Guys, I have made the changes. Thank you for your help.

that was a pretty cool survey form, except, I would suggest that the inputs are not the same color as the form’s background.

1 Like

Thank you for a suggestion @ConnerOw1115.