2nd Project- Survey Form

Hey everyone! Completed my survey form, but my page is not responsive. Any help would be appreciated. Should i use - meta name=“viewport” content=“width=device-width, initial-scale=1.0”>- at the top of the html and thta would be it? or use media queries in css alone.

https://codepen.io/x-rena/full/MWavNKz

Hello there.

Just on the “red errors”, CodePen is complaining because the input element has no closing tag (outside of React).

In terms of responsiveness: Use % instead of px when you are defining your elements’ width property.

Hope this helps

so are you saying I won’t be able to fix it if i’ve never used React?

I tried doing the 100% on media queries, but nothing.

@X-rena, </input> is not a valid HTML tag. The input tag is self-closing. Go back and revisit the lesson on creating radio buttons/checkboxes for a quick refresher.

Btw, I usually tell people to run HTML code through the W3C validator. The validator provided by codepen misses a lot of errors.

  • Since copy/paste from codepen you can ignore the first warning and first two errors.
  • There are coding errors you need to address.

You didn’t ask but I’ll also mentions, don’t use <br> to force spacing. Use margin and/or padding in CSS.

1 Like

Ah shoot, you’re right. Input tags are self closing. My bad! :sweat_smile:

1 Like

oh my, this is much appreciated. I added the link to my favorites to use from now on. I will make the necessary changes and will update you guys.

Hello, I was able to correct the errors, but still having a bit of difficulty with my project being responsive