Technical Documentation help please!

Code Feedback
1

Hello,

I am stuck on trying to pass these final 4 tests of this. I am also having some problems with the layout. I would like it so the main body goes higher up and to the right of the navbar and I would prefer the text in the sections to not stretch across horizontally in the screen. I would like some general feedback on my project too as well as any other points you may have.

Here is the link to my project.
https://codepen.io/Hannahro15/pen/rNMELwW

Thanks,
Hannah

2

Hi! You can press F12 on the example given in the project scope (https://codepen.io/freeCodeCamp/full/NdrKKL) so you can see how everything was built. I don’t know if it’s cheating but I’ve learned a LOT doing this so I consider it valid. :smiley:

1 Like
3

I also like to use that trick to see how things come together, it’s particularly helpful in hunting down why something isn’t doing what you think it should be doing. Short of plagiarizing someone else’s work finding tricks to help you better understand code isn’t cheating.

4

Iv’e taken a look at your code and I see where you might be getting some errors. You’re not passing test 6 because your nav headings and main headings don’t match when underscores _ are ignored by the testing script so go ahead and match those up in terms of case and syntax, same spelling, same font letter sizing, etc. Another proplem I saw was this:

    !!There is no main-section for this nav element!!
<li>
  <a class="nav-link"
     href="#Chess_Websites">Chess Websites</a>

I commented it out as I tinkered with your code, you have a nav link pointing to nowhere, so either add a “chess websites section to your html” or remove that nav link like I did. Next your are not pasing test 7 because there are not enough List items in your html body so add some more into your “sections”, you need at leat 5 or more in total. Lastly your nov should be programmed to be fixed to the top on smaller screens, something you can acomplish using media queries ==> https://codepen.io/ShefroyRowe/pen/dyOQOaz <== view my page to see how I did it. Hope it all works out, blessings.

1 Like
5

@hannahro15, when tests fail 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.

To help you visualize how you have your elements set up (and see why the main body is so low), temporarily add the following global reset at the top of the CSS editor;

* {
  border: solid 1px red;
}
  • 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.
    • Mainly mentioning because you have elements out of order. Everything the browser renders must be in the body element. Review this for an understanding of the HTML boilerplate tags.
1 Like
6

Thanks for all of your feedback. I will see what I can do to take these points on board and then I can re-share my project again.

2 Likes
7

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