Done with survey form

I tried to make it as responsive as possible.

1 Like

Your form looks good @tayfundursun. Some things to revisit;

  • Run your HTML code through the W3C validator.

    • There are HTML syntax/coding errors you should be aware of and address.
      Since copy/paste from codepen you can ignore the first warning and first two errors.
  • User’s should be able to click on the label to toggle a selection, not just the radio button / checkbox

  • Keep all your styling external. Do not use in-line styling

  • The layout of your form looks better on a smaller screen. Just some notes;

  • Rather than using fixed dimensions on elements, use max-width/height and relative units like %, em, rem and vw to keep everything responsive.

  • Start by styling for a narrow view port first. Narrow your browser as far as it will go and style the page so it looks good at that narrow width. Then gradually widen your browser and use CSS media query break points to adjust the style for wider view ports if needed.

1 Like

I ran the validator and I fixed every error except the first four input labels, I don’t know why but the script wants some text inside those labels. (I uploaded the accurate one to my Github.) I fixed other problems quite easily, though changed the style a bit. Much appreciated.

I’ll use more relative units, and use your technic about responsive design.