Developer Cat Survey Form

Code Feedback
1

I just finished working on the Survey Form. Had a lot of fun since I’m used to working with forms a lot.

I also took the challenge to replicate the same form without looking at the source code. Took me 2 days in total because I wanted to make it fully responsive. The first day I did a mess and the second day (today) I nailed it in under 2 hours after starting from scratch.

Feeling a bit more confident since I never took the time to invest it on CSS.

Any feedback is appreciated. :grinning:

Here’s the link: https://codepen.io/angel-santiago31/pen/pGLaxz

1 Like
2

If you’ve ever filled out a form you may have noticed that the asterisk means the field is required. You have asterisks for fields that aren’t required. Very misleading.

1 Like
3

very nicely made, the page looks great and is very responsive. I also like the button design, it might be a good idea to add a button:hover in your css.
there are a couple things that can be fixed in your html

  • in line 50 , ‘active’ is not a valid attribute for the option tag you should use ‘selected’ instead
  • in line 83 you have a blank cols attribute in your textarea
    good luck :+1:
4

Nice form @anon18913258! :metal:

I know, playing with a form is a little bit difficult. So I tried a form from Bootstrap.

But looking at your form, I think I can create such a good form using HTML and CSS.

It is very simple and clear, I like the font you used. :slightly_smiling_face:

Good Luck :+1:

– @gauravkukade

1 Like
5

I considered all these to be required but seems like I slipped on adding the required attribute. Thanks for pointing it out. :grinning:

6

I had a funny feeling that I used the wrong attribute haha!

Yes, I made the col empty on purpose (not sure if it’s a bad practice) so my padding wouldn’t interfere. I took the lazy way for this one :sweat_smile:

7

Thanks! And yes, we can get a bit stuck thinking that CSS frameworks are the way to go but hey, I’ve seen lots of pages that use custom CSS and that inspires to me to take the time to make it myself.

The font is called Montserrat by google fonts :grinning:

1 Like
8

not sure if it is but most html validators mark it as an error