Survey form for project #2

Please have a look and give me any feedback that will help improve my projects in the future.

I had a hard time getting my second checkbox to align properly and still have yet to figure it out but I’m still going back and checking from time to time. If anyone has any suggestions I’m all ears, or technically all eyes… :laughing:

Here is the link to my codepen:
https://codepen.io/Smilioso/pen/oNjedaZ

1 Like

Hello,

Here I see the “What will you do once quarantine is over? (Check all that apply)” part in a strange way, it’s a line but with not all elements on same baseline and some of them are out of the white part :slight_smile:

label {
  display: flex;
  align-items: center;
  font-size: 1.125rem;
  margin-bottom: 0.5rem;
}

Try to replace align-items by “baseline”, see what happens :slight_smile: then try to delete display and align-items and compare visual results.

I think you have some “fighting” between elements, classes and id - you could have a look there Cascading style - MDN

Have a nice day <3

@lorens

Use this code at the bottom to your css - and see the magic

.form-group label{
  display:block;
  text-align:left;
}

Actually that’s not a magic but I encourage you to learn css more

@lorens, some things to revisit with your form;

  • 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 multiple coding errors you should address.
  • Change the cursor to a pointer when hovering over the submit button

Thank you for the help and the link, I will look into it :slightly_smiling_face:

Thank you for the information and for the help. I will definitely look more into css because I was hard-pressed when working on that part :sweat_smile:

Wow! Ok thank you. I will do that🙂