Feedback on Technical Documentation Page

Hi FCCers! I’d be really grateful for feedback on my Technical Documentation Page at

Also, I made a second version using jQuery to show/hide the navigation section - at https://codepen.io/mcpop999/full/KebNgE/

This was just for fun, and it doesn’t pass the FCC tests because the nav panel is not permanently visible, but any views/error checking on different devices would be great!

Thanks in advance.
Richard

Looks good,(I didn’t check the jquery version)

Seems everything is great! neat, simple and clean design.

Beside it works, and layout is functional, but I would suggest you some changes.

Code blocks, they are inline-block, I suggest let them just be block
Same you applied some left-margin for code blocks(in both mobile and desktop view), I suggest you remove that.

In small screen size, if a line comes without any space or breakable section, so that line causes layout break and horizontal scrolling, mostly becasue of code blocks. check:


Note the highlighted text, since it goes lengthy, so broke the layout and horizontal scroll.

Fix is easy, you can either let code block scroll when needed using overflow:auto, but I think you should set it as block too, instead of inline-block
Another solution is let it breaks at any place there is no more space using word-break:break-all

Another suggestion is place one horizontal line <hr/> after each title(h2 tag) in your reading panel. it helps to scan the page easier I believe.

Inline code blocks (code tag used with inline text), please add a background colour.

For mobile I think a little more line-height could be great. Spacing between paragraphs are very good.

I say it’s a good work dear, perfect. If you could apply that fixes, it will be awesome.

Keep going on great work, happy programming.

Thank you for the feedback! I will look at implementing your suggestions.