TFT - Survey Form

Hi! I would like to receive feedback from my second project

Hi @arganarazalvaro, your form looks good. Some things to revisit;

  • On using codepen. codepen only expects the code you’d put within the <body> </body> tags in HTML. (No need to include the body tags). For anything you want to add to <head> click on the ‘Settings’ button, then HTML and add it into the ‘Stuff for <head>’ box.
  • Run your code through this validator. Just copy your HTML and paste it into the ‘Validate by Direct Input’ tab.
    • There are a few things you should clean up. (Footer element belongs in the body)
  • In the CSS section you have a duplicate entry for margin in your input-checkbox class
  • Don’t use <br> to force spacing. Use margin and/or padding in CSS.
  • Make it so users can click the labels, not just the radio buttons. (You did this for the checkboxes)
  • Maybe add some placeholder text in that big white box so users know what it’s for.
  • Change the cursor to a pointer when hovering over the submit button.

Thank you for your comments! It was really useful.
I have made some changes and I think it is better now. In br, I am using them to make checkboxes and radio buttons enter a column.
The validator is a great tool. The only remaining errors are for the p elements within the tags. But if I use the elements of the label, the label places the text to the left of the box, instead of at the top.
Thanks again!!

Yes, I know why you’re using it. It’s not good though. Google fieldset. There are ways to do what you want to do without using br. And there are other places where you’ve used br to induce spacing. Again, for that you should use margin and/or padding in CSS.

Again, there are ways to group these without the incorrect usage of the p element.

Hi! I think the problems are solved, could you take a look? Thanks!

Just a quick note about the forums. If you use the Reply link within the persons post they get notified that you’re replying. If you use the Reply button at the bottom of the page they do not get a notification.

The only other suggestion I have it to use external styling only. In your footer you have a paragraph that uses in-line styling.
Good job cleaning things up.

Done. Thanks again!!!

1 Like