My second project (Survey Page)

Here is my survey page, i spent nearly 4 hours on it.

https://codepen.io/epicaiden28/full/LYPLVMy

please provide feedback if you may!

Hi,

Open the browser’s developer tools and turn on the mobile view.

I guess the next step is to make your page to be responsive. So it will look nice on all the screens. :slight_smile:

Hi there, im kinda confused on how to make it responsive, any advice?

In order to understand the core principles I suggest you to pass these three topics from the curriculum:

Mk ill take a look at them again, thanks!

Without a responsiveness, your project on a mobile looks like on the screenshot below:

Hey, Nice job, but your borders don’t match and are a bit too thick.
I see you like to use gradients. maybe do it from top to bottom instead of moving from left to right.
I like the background you picked.
The textArea comment section is too small and the text is aligned backwards. Please change the alignment to something like center or corner.

At all else, great job.

Keep up the good work!!

Hi @aidenhoward420, your page has a good start. There are a few things you may want to revisit;

  • Keep the test script when forking the pen (<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>). Your page passes 7/17 user stories.
  • codepen provides validators for HTML, CSS and JS. Click on the down arrow in the upper right of each section and then click on the respective ‘Analyze’ link.
  • Use external CSS for styling instead of using inline/internal CSS
1 Like

Alright there we go, user stories 17/17, any other feedback?

https://codepen.io/epicaiden28/full/KKPqBXp

@aidenhoward420, good job on meeting all the user stories. A few things you may want to revisit;

  • id's can be used only once. You’ve used a couple of id's more than once. (HTML validator will show you this.)
  • There are better ways to group your radio buttons instead of an unordered list.
  • Regarding your checkboxes, you require users to check both of them.
    • Not quite sure why there’s a min and max range on your checkboxes.
  • Allow users to use the labels of the checkboxes to check them.
  • there’s a stray closing <head> tag. This isn’t an element that would be in <body> </body> tags.
  • change the cursor to a pointer when hovering over the submit button