4th Project / Technical documentation page

Code Feedback
1

https://codepen.io/bboros/pen/VwmMrLx

Hey Hey All, :slight_smile: I just finished my 4th project. Feel free to make any negative or positive comments, suggestions to improve also welcome and would highly appreciate that. :slight_smile: :slight_smile: Many thanks in advance :wink:

2

Well done however your main section slides about - even going under your nav - on smaller screens (mobile)

1 Like
3

Many Thanks, Much appreciate it. Ill look in to that :slight_smile:

4

Your page looks good @bboros. Some things to revisit;

  • 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.
    • Mentioning because you have elements out of order and elements are incorrect. Everything the browser renders belongs in the body element. Review this for an understanding of the HTML boilerplate tags.
  • Run your HTML code through the W3C validator.
    • There are HTML coding errors you should be aware of and address.
    • Since copy/paste from codepen you can ignore the first warning and first two errors.
  • Do not use the <br> element to force line breaks or spacing. That’s what CSS is for.
    • Reference MDN Docs
    • You can nest multi-line <code> snippets in <pre> </pre> tags in HTML to preserve whitespace and line breaks.
      Or skip the pre element and do the following in CSS;
       code {
         white-space: pre-line;
       }
1 Like
5

@Roma !

Much appreciate that and would like to say big thank You for Your time to check my work.
Went through on Your suggestions, fixed issues and also used validator.

Please see below link for edited version:

https://codepen.io/bboros/pen/qBqVjvK

Many Thanks again!

6

@bboros, I see things were cleaned up but I’m still seeing the following issues you’ll want to revisit;

  • Keep the test script when forking the pen (<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>)
    • The test script, with all tests passing, should be included when you submit your projects.
    • Your page passes 14/16 user stories. Click the red button to see which test(s) are failing and text to help you correct the issue.
    • Be sure and read more than just the first line of the failing message. The ability to read and comprehend error messages is a skill you’ll need to acquire as a developer. Ask questions on what you don’t understand.
  • As mentioned previously, do not use the <br> element to force line breaks or spacing. That’s what CSS is for.

On a side note, you don’t have to create a new pen each time. If you edit your current pen the changes will be picked up and you won’t have to resubmit your completed project.

7

@Roma

Many Thanks! All fixed and deleted second pen and edited original one. I believe it will meet all standard requirement now. However lesson learned and Ill make sure will put more attention to details on next project. If something still needs to be re-visit please feel free to add below.

Many Thanks :slight_smile:

1 Like
8

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