Survey Form - feedback please! šŸ˜Š

Code Feedback
1

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.

2

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.

3

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