I can’t get the landing page test to pass. Help! I’ve tried all I can, still I cant get tests 2 and 5 to pass,
Please find my codepen link below
Welcome back @dewalemi.
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 first failing message says
I can see an image within the #header element with a corresponding id="header-img". A company logo would make a good image here.
#header-img is not an <img> element : expected 'HEADER' to equal 'IMG'
AssertionError: #header-img is not an <img> element : expected 'HEADER' to equal 'IMG'
Do you understand what the test is looking for and why it fails?
On a side note, you should run your HTML code through the W3C validator and correct the errors.
The second failing message says
When I click a .nav-link button in the nav element, I am taken to the corresponding section of the landing page.'
The .nav-link with href="#about us" is not linked to a corresponding element on the page : expected null to not equal null
AssertionError: The .nav-link with href="#about us" is not linked to a corresponding element on the page : expected null to not equal null
Do you understand what the test is looking for and why it fails?
On a side note, do not include style tags in the CSS editor. They are HTML tags and would not be in CSS. Leaving them there will cause issues.
I also notice some typo’s.
As a suggestion switch the Syntax Highlighting in Codepen to help catch errors.
Go to your Codepen profile Settings → Editor Preferences (not the setting for the pen, but for your profile). Switch the Syntax Highlighting to Oceanic Dark and save the setting. Go back to the pen and make sure your new setting is working. The code highlighting will be using different colors. Errors will now be marked in red.
2 Likes
Thank you for your explanations @Roma.
I have switched the syntax highlighter to Oceanic dark, and it has changed the appearance of the code pen, but I still don’t know what to do to correct the errors. I opened the validator as well, but don’t know what it is asking me to do.
The first failing test regarding the header is because you have a coding error. The validator tells you The element header must not appear as a descendant of the header element.
So you need to fix that.
The next test fails because as it says, the nav-link doesn’t go anywhere. You haven’t linked to an internal section of your page. You can review this lesson if you’re not sure how to do that.
It pretty much tells you. For instance,
No space between attributes.
At line 5, column 135
it’s giving you the line number in the code and telling you that there’s not a space between attributes.
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.