Run Test for Tribute Page

I just started building my Tribute page. I closed out of the RUN TEST box and I’m not sure how to retrieve this. Here is my pageTribute

1 Like

This is cosing you err:

<main id="main>"

see "

1 Like

Thank you! I just fixed it!

1 Like

You need closing tag for this:

<body id="tribute-info">
mising    </body>

and that is all

Zalinka, is there a way you could see why my text isn’t aligned to the left? I used CSS to align text.

Ok ,I will ,give me some time

1 Like

I am not sure what you mean by justified to the left. The text stretches from one side to the other.

Sorry. I meant aligned to the left of the page so that I can indent paragraphs.

here you got sam exampl:

text is strect
if you wont to break words youse:


Do you wont img or paragrafs?
I didnt quait untherstend?

I wanted paragraphs.

When most people think of Steve Jobs, they think of the genius who started Apple. Do most people think college drop out or zen student? Probably not.

it is left:

 <p style="color:#ff1d76">   When most people think of Steve Jobs,<br> they think of the genius who built Apple.<br> Do most people think college drop<br> out or zen-student? Probably not.   </p>

and you can put right
what ever you wont

Keep the test script when forking the pen (<script src=""></script>)

  • The test script, with all tests passing, should be included when you submit your projects.
  • Your page passes 4/10 user stories. 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.
  • 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.
    • You have elements out of order. Everything the browser renders belong in the ‘body’ element. Review this for an understanding of the HTML boilerplate tags.
  • Keep all your styling external. Do not use in-line styling.

Thank you . “Forking” the pen? I’m not sure what that means exactly. Also, I tried to avoid inline styling but CSS was not working properly to style elements. Then when I attempted to erase my inline styling such as the color style for my

elements…erasing the style attribute took all of the paragraph from the reader’s view as you can probably see…if comparing my markup with the user view.

I really don’t know what I’m doing. I thought I did but in code pen, the CSS syling that I’m using isn’t working.

The instructions say;
“You can build your project by forking this CodePen pen.”
If you were to click that link when you were reading the instructions AND you were logged into your codepen account you’ll see a “fork” button on the bottom right of the iframe. Clicking it would create a blank pen for you with the FCC test script embedded for you.
Since you didn’t do that, take the script I posted and put it at the top of the HTML editor. You’ll see a green hamburger menu in the upper left of your pen. Click to expand it, select the project and run the test.

It will fail if the CSS code is incorrect. For instance, you have this property: value; pair in CSS
text-color:blue; but text-color is not a valid property so it will not work the way you think it should work.

There shouldn’t be a disconnect when using codepen. The HTML editor in codepen is the same as any HTML editor in any IDE. The CSS editor in codepen is the same as using an external stylesheet. If the external stylesheet has an error like text-color:blue; then it will not style the page correctly.

That’s okay. That’s why the forum is here. To help guide you. We don’t like to give explicit answers because then you don’t learn but we will guide you and explain so you’ll understand.

Thank you! I pasted the link in the top of my html editor- worked like a charm. Still not sure why it went away permanently but that’s ok. Thanks so much for helping me. I fixed the text-color bit. Sometimes, it’s helpful just to have another set of eyes. After learning so much code on here in such a little time…it sometimes get’s jumbled. PALM FACE.
I’m trying to make sure I absorb it all but I really can’t without some input as well as putting it all into practice…palm face… “heavy sigh”. I’m kind of determined though and I’m looking at other resources besides Free Code Camp to help me.

Learning it all can be a bit daunting at times. Just remember, Google is your friend, don’t be afraid to use it. As long as you code you’ll be searching.

Remember what I mentioned about having elements out of order.

A couple of things;

  • As a suggestion switch the Syntax Highlighting in Codepen to help catch errors.
    Go to your Codepen profile settings (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.

If you follow that suggestion one of the things you’ll see in red will be the closing div on this line
<div id="img-div"> <a id="tribute-link" target="_blank" href=">" </div>
Do you see the typo?

The closing quote for the URL is outside the angle bracket

Doing the projects is a good way to learn and asking for feedback is a good practice. We learn from our mistakes.

If you are looking for other resouces to help you study I strongly recommend youtube. There are lots of very good tutorials on there. I would be lost without it honestly.
For me it’s my number 1 place to learn. I find the combination of audio & visual tuition seems to sink in better for me than just reading stuff. Don’t worry, I don’t know what forking the pen means either. Rome wasn’t built in a day.
I would be curious to know how you did get rid of the freecodecamp test suite as I’d like to get rid of it for my portfolio project as I used thumbnails images of the projects for links and the test suite spoils the look slightly