Build a survey form test question

HTML-CSS
1

I just passed the build a survey form test. However I have few questions regarding the layout.

Here is the freecodecamp sample: https://codepen.io/freeCodeCamp/full/VPaoNP I was wondering how can I make the survey form reach the end bottom of the background just like how its shown in the FCC sample in the link above. I tried but there is always a small space left between the background and the bottom end of the survey.

Here is the code that I worked on for reference: https://codepen.io/sirajms5/pen/NWaWVrg

Thank you

2

@sirajms5, let me first say that the sample projects show just one way to complete the project. The instructions say to make yours “functionally similar” and “give it your own personal style”.
Personally I like that your form ends without being at the bottom of the page. It looks more complete to me.

Before we can address your issue you have quite a few syntax errors in your code that you need to take care of first.
Run your HTML code through the W3C validator.

  • There are HTML syntax/coding errors you should be aware of and address.
    Since copy/paste from codepen you can ignore the first warning and first two errors.

And I know you’re not asking for feedback but because I see them in our code I’ll mention, do not use the <br> element to force line breaks or spacing. That’s what CSS is for.

Clean up your code and then come back if you still want to address what you’re seeing.
If you decide you like it the way it is, it’s a good idea to ask for feedback on your completed project in the #project-feedback subforum.

1 Like
3

@Roma thank you for your fast reply.

The W3C validator is really a good tool that I didn’t know about, I appreciate that you shared it with me.

I fixed all the errors in my code except one “element head is missing”. I tried to fix it, but it still shows up as an error. Can you check it out, please?

I removed all the “br” element from my html code.

Thank you for your feedback much appreciated.

4

Codepen provides the boilerplate for you. It only expects the code you’d put within the body element in the HTML editor. (No need to include the body tags). For anything you want to add to the <head> element click on the ‘Settings’ button, then HTML and add it into the ‘Stuff for <head>’ box.
Review this for an understanding of the HTML boilerplate tags.

The W3C validator is a good tool to keep and use.

5

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.