Survey Form - feedback please! 😊

Hi everyone,

I’ve created my survey page and would really value getting some feedback! https://codepen.io/greenoid/pen/rPBWXm

The styling is very similar to the example given (https://codepen.io/freeCodeCamp/full/VPaoNP) - I didn’t just look at the code but instead wanted to challenge myself to recreate it and then change a couple of things (for example when you check the “Other” checkbox a text input appears so that you can specify)

The main aspect I’ve not been able to re-create is to make the form as responsive as the example. Specifically, when the example is resized the form layout changes so that the inputs move below the labels. I presume this is just a media query but I couldn’t figure out how to make this work when using CSS Grid - I think maybe I’ve implemented grid in a weird way?

Keen to hear any feedback, particularly around making my form accessibility friendly!

Many thanks in advance.

nice, may its nice to:

  • play with styling of the input fields. like the input field of a <input type="checkbox"/>
  • You also can add a :hover effect to the button at the end.
  • the text area has a lot of spaces in the input value NEVER USE SPACES BEFORE A TEXTAREA

only feedback nothing more.

Thanks so much for your feeback Floww !

I wasn’t sure what was wrong with my textarea but wasn’t sure what exactly was going on… so thank you for helping a newbie out :blush: ! And great suggestion about the hover effect for the submit button

Next up I’ll be sure to make the input styling more interesting - thanks again for such helpful feedback!

Anyone else got any suggestions?

1 Like