I’ve restarted freecodecamp to get a good review and I’ve gotten a lot more experience with programming. I’ve made this survey form:
Here is the Github link:
Thanks to @usaspiff for helping me fix the thirteenth test.
Any and all feedback is appreciated.
It looks like the user story #13 doesn’t pass because the radio buttons “Yes”, “No” and “Maybe” in the “Would you recommend freecodecamp to a friend?” section don’t have a value input, only a type and a name.
Try to add a value input set to their field for each one and see if it works.
You can check out this link if you are stuck:
Thank you, @usaspiff
Now a github view is available.
Your page looks good!
Only ‘Would you recommend freecodecamp to a friend?’ answers have some problems on smaller screens. I would use flex in this case, I have no simple idea for you without it yet, not enough experience
Try to use ‘Tidy’ option, it’s easier to read code if you do that:
I don’t think using
<br> for spacings is a good idea
You can use container like
<section></section> or just
<div class="container"></div> and then add margins to get the same result. Use any approprierate name for that class
<span>....................</span> from there:
<input type = "checkbox" value = "0">HTML <span>....................</span>
CSS<input type = "checkbox" value = "1"><br>
can be replaced by sth better. Try using classes:
class="checkbox-rigth" and then add some margins to them
You could also use CSS Flex / Grid
Add more space for the footer, it collides with submit button on small screens
Your page is really well done so far
Okay. I’ll try my best to do what you asked. The checkboxes had to be aligned that way with invisible rows of periods because I don’t really know any other way to align them. I’ve tried like fifty times and failed every single time except when I did it like that.
I’ll try using section tags to space things out.
Yeah. Responsiveness was one of my enemies when I started coding. I always resize the editor to see if it works. I will tidy my code.
Thanks for the feedback.
I did it that way
It’s my own project. I could fix some things there, but maybe later
What important is this:
<input type="checkbox" id="action" value="on">
<input type="checkbox" id="adventure" value="on">
grid-template-columns: repeat(auto-fit, minmax(130px, 1fr) );
Just set different values in minmax() function and use margins or
repeat() on MDN
CSS Grid guide