Build a Survey From - Feedback & ErrorCorrection

Hello everyone,
I have completed my Survey Form project. But, it seems like there are some issues with different screen sizes in my code. In the form, all checkbox elements are not displaying properly ( Need suggestions to resolve this ). Moreover, the code looks quite lengthy and redundant ( flow of code is proper or there are easy ways to do it ??).

Link to my project:

Not sure what you mean by checkbox elements not displaying properly. They look good to me.

The flow of your code looks fine to me. In codepen, there is no need to use any of html, head or body tags. They are prepopulated for you behind the scene. You can also add some hover effect like changing color of button text when mouse hovers on your submit button.

Checkbox elements are cramped and not following a straight line from screen size 540px to 480px in codepen ??

Give your .form-checkbox

text-align: left

1 Like

It looks like you’re not associating your label elements for input with the label elements surrounding it. Take a look at this lesson again. Same thing will apply to checkboxes.
Where you did use it, most times you misspelled “label”. In codepen, in the upper right of the HTML section click on the down arrow and then click on ‘Analyze HTML’.

I think cleaning things up a little may help with the issue you’re seeing. (I’ve been wrong before though.)

1 Like

I suggest you styling your button with #submit:hover {cursor: pointer}; at least, it’s not interactive at all but should be. Also add to your textarea such properties as resize: none; overflow: auto;. Usually It’s a bad practice letting a user change textform’s dimensions, that can cause problems.
Oh, and use maxlength | minlength attributes in your HTML code for name and email inputs so it won’t be possible to type a billion of symbols.

1 Like