Technical Documentation - Page Feedback

Need feedback on my technical documentation page …

I don’t know much about Python… so I added whatever I felt was important, from w3schools

Let me know if it needs any improvements : )

link : https://codepen.io/durden_20/pen/oNWMWQJ?editors=1100

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

  • 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.
  • Codepen provides validators for HTML, CSS and JS. Click on the chevron in the upper right of each section and then click on the respective ‘Analyze’ link.
    • The one for CSS is good. Use it and address the issue(s). (be wary of duplicating selectors as it can make maintenance a nightmare)
    • (The one for HTML misses things which is why I recommend W3C)
  • Keep all your styling external. Do not use in-line styling.
1 Like

:+1:t2: I corrected few errors…

Q : has the site passed all the tests?
cause when the width of the screen is above 867px it passes all the tests 16/16
but when it’s below 867 it only passes 15 tests

Your page looks really good. The design, the hover look amazing. I’d say the information you put in about Python in website is kinda enough. Nothing to be removed or added. Anyway, can you show me the code about your menu hover? It looks cool and I want to use it maybe in some of my future projects

1 Like

Good job cleaning things up @geeth9792.

Yes, all tests pass successfully.
When a test fails 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.

The test that fails when the screen size is below 867 says

On regular sized devices (laptops, desktops), the element with id="navbar" should be shown on the left half of the screen. It should always be visible to the user and should remain stationary. You may need to enlarge the viewport or zoom out to ensure the navbar doesn't scroll with the page content.
Please run this test in a larger window (before any media queries) : expected 801 to be above 850
AssertionError: Please run this test in a larger window (before any media queries) : expected 801 to be above 850

Do you understand why the test fails when the screen size is too narrow? What the test is looking for and what it’s telling you to do to correct the issue?

1 Like

oh, Thanks… :grin:

Sure :-

nav ul li a {
  text-decoration: none;
  display: inline-block;
  color: white;
  transition: all .4s;
}

nav ul li a:hover {
  transform: scale(1.11);
  border-bottom: 1px solid red;
}

I don’t quite understand :slightly_frowning_face:

on regular sized devices The nav bar stationary and is visible on the left side of the screen, but it still shows error…

can you explain it to me?

On a regular sized device the test does pass. When you narrow the browsers’s width you are simulating a smaller device, one that is not as wide as a laptop or desktop.

1 Like

oh, I understood that…

I just thought it was supposed to show full pass even in the narrow screen and I was still doing something wrong which is why it showed 1 fail

it was a misunderstanding , thanks for clearing it.

Thank you, I really appreciate it. Looking forward to see more of your project

1 Like

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