I just finished my tribute page project. When I run it it says I have done 9/10 tests. Its highlighting issue with userstory1. Can anybody help me to understand this issue?
First of all, when using codepen you don’t have to use html and head tags. Codepen provides that boilerplate for you behind the scenes. Anything you write in the HTML section is actually what you would put in between the body tags.
If you want to include something in head of the document you can do so in the codepen settings:
Now back to your issue. This is the important part of your error message:
My tribute page should have an element with corresponding id=“main”, which contains all other elements.
Did you have an element with id=“main” in your code?
<head> tag is pretty specific as to what should be in it, element with id #main was supposed to be main content of your page, you can use e.g. <div> or <main>
The other posters already provided you with the answer you were looking for but I do want to mention two things that should be fixed before submitting.
Please do not use br tags. br tags are used when division of lines is significant like in a poem or address. Please use css for space between elements.
The center tag is no longer used in HTML 5. Please use CSS instead.
I could catch my mistake. I had put id main for head, which was incorrect way.
I changed and created div (which had all elements) and assigned id=“main”.
@agrawalparul2 good job on getting the user stories to pass but there are some serious issues with your page that you should revisit.
As was previously mentioned, codepen provides the boilerplate for you. It only expects the code you’d put within the body element in HTML. (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.
You have elements out of order and incorrectly used. You can review this for an understanding of the HTML boilerplate tags.
Also, you should run your HTML code through the W3C validator.
There are HTML coding errors you should be aware of and address.
And as mentioned, do not use the <br> element to force line breaks or spacing. That’s what CSS is for.
There are places in your code where you’re using it in a way that is against the published standards.
That was great information. It gave me lot of clarity on what goes where. When I ran code on validator I had loads of issues, I fixed them all except DOCTYPE, language and missing head tags (as we do not enter these in codepen).
I have also removed all the <br> tags and used CSS instead.
I think it looks a lot better. Good job making those changes.
My thoughts:
I would personally use the strong tag over the b tag here. The strong tag is used for strong emphasis whereas the b tag doesn’t really hold any importance.
<h1 id="title"> <b>MAHATMA GANDHI</b> </h1>
I think the img alt tag should have text in it. It is important for those with assistive devices.
Your page looks good @agrawalparul2. Nice job cleaning things up.
Yes, when running the W3C validator you’re correct in ignoring the first warning and first two errors.
There’s a little typo in your CSS (line 27).
Codepen provides validators for HTML, CSS and JS. Click on the down arrow 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).
(The one for HTML misses things which is why I recommend W3C)
