Finished second project #surveyform

Hello everyone,
i have just completed my survey form.
please check it out and feel free to guide me on anything.
Thank you in advance.
the link is https://codepen.io/Cynthia7/pen/PoPVjBL

1 Like

Work more on CSS. It is not very good. You do know HTML elements but work more on CSS. :slight_smile:

Hi, i really like your page.

I think you should get an image with more quality and i think the submit bottom will lokk better with align center.
And the color of the text, because of the background, makes me hard to read.

After that i think is ok, but i am not a pro this is just personal thoughts.

Some things to revisit on your form @cynthia7;

  • Run your HTML code through the W3C validator.
    • Since copy/paste from codepen you can ignore the first warning and first two errors.
    • There are coding errors you should address. Remember, an id must be unique within the document.
  • User’s should be able to click the label to make a choice, not just the radio button / checkbox.
    • Review the lessons about adding labels to radio buttons / checkboxes. Proper nesting too.
  • Don’t use <br> to force line break…or spacing. Use CSS
    • side note: there is no such tag as </br>
  • The submit button is very small, almost missed it.
  • Change the cursor to a pointer when hovering over the submit button.
  • You have a font-family for “broadway”. You may have it loaded on your machine, most will not. If you want to use a non-traditional font get one from google fonts and either link or import it.
    • Side note: when using a font that has spaces it must be in quotes. So it would be “Times New Roman”. Google font-family to see when quotes are needed and not needed.

I don’t normally comment on styling but your form is very hard to read. There’s not enough contrast between your font coloring choices and the background. In some places in the welcome the font color blends in with the woman’s arms making it impossible to read.

  • You can put your form in a container and add some opacity to it to make it contrast with the background pic.

hello everyone,
thank you for your help.
this is what i have been able to do
please check it out: https://codepen.io/Cynthia7/pen/PoPVjBL