# Run Test for Tribute Page

**URL:** <https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713>\
**Category:** I Built This\
**Created:** [August 28, 2021, 11:16pm UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713 "2021-08-28T23:16:57Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![ilykesuga](https://avatars.discourse-cdn.com/v4/letter/i/a9adbd/32.png) [@ilykesuga](https://forum.freecodecamp.org/u/ilykesuga)\
**Post date:** [August 28, 2021, 11:16pm UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/1 "2021-08-28T23:16:57Z")

</div>

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 page[Tribute](https://codepen.io/meowww/pen/vYZNNjR)

---

<div class="post-metadata">

**Author:** ![zaklina](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/zaklina/32/221235_2.png) [@zaklina](https://forum.freecodecamp.org/u/zaklina)\
**Post date:** [August 28, 2021, 11:32pm UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/2 "2021-08-28T23:32:28Z")

</div>

This is cosing you err:

```auto
<main id="main>"

```

see "

---

<div class="post-metadata">

**Author:** ![ilykesuga](https://avatars.discourse-cdn.com/v4/letter/i/a9adbd/32.png) [@ilykesuga](https://forum.freecodecamp.org/u/ilykesuga)\
**Post date:** [August 28, 2021, 11:34pm UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/3 "2021-08-28T23:34:03Z")

</div>

Thank you! I just fixed it!

---

<div class="post-metadata">

**Author:** ![zaklina](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/zaklina/32/221235_2.png) [@zaklina](https://forum.freecodecamp.org/u/zaklina)\
**Post date:** [August 28, 2021, 11:37pm UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/4 "2021-08-28T23:37:47Z")

</div>

You need closing tag for this:

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

```

and that is all

---

<div class="post-metadata">

**Author:** ![ilykesuga](https://avatars.discourse-cdn.com/v4/letter/i/a9adbd/32.png) [@ilykesuga](https://forum.freecodecamp.org/u/ilykesuga)\
**Post date:** [August 28, 2021, 11:42pm UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/5 "2021-08-28T23:42:40Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![zaklina](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/zaklina/32/221235_2.png) [@zaklina](https://forum.freecodecamp.org/u/zaklina)\
**Post date:** [August 28, 2021, 11:43pm UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/6 "2021-08-28T23:43:47Z")

</div>

Ok ,I will ,give me some time

---

<div class="post-metadata">

**Author:** ![Jaydog](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jaydog/32/228784_2.png) [@Jaydog](https://forum.freecodecamp.org/u/Jaydog)\
**Post date:** [August 28, 2021, 11:49pm UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/7 "2021-08-28T23:49:14Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![ilykesuga](https://avatars.discourse-cdn.com/v4/letter/i/a9adbd/32.png) [@ilykesuga](https://forum.freecodecamp.org/u/ilykesuga)\
**Post date:** [August 28, 2021, 11:53pm UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/8 "2021-08-28T23:53:49Z")

</div>

Sorry. I meant _aligned to the left of the page_ so that I can indent paragraphs.

---

<div class="post-metadata">

**Author:** ![zaklina](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/zaklina/32/221235_2.png) [@zaklina](https://forum.freecodecamp.org/u/zaklina)\
**Post date:** [August 29, 2021, 12:03am UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/9 "2021-08-29T00:03:25Z")

</div>

here you got sam exampl:  
[https://www.homeandlearn.co.uk/WD/wds4p6.html](https://www.homeandlearn.co.uk/WD/wds4p6.html)

text is strect  
if you wont to break words youse:

```auto
<br>

```

---

<div class="post-metadata">

**Author:** ![zaklina](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/zaklina/32/221235_2.png) [@zaklina](https://forum.freecodecamp.org/u/zaklina)\
**Post date:** [August 29, 2021, 12:11am UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/10 "2021-08-29T00:11:00Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![ilykesuga](https://avatars.discourse-cdn.com/v4/letter/i/a9adbd/32.png) [@ilykesuga](https://forum.freecodecamp.org/u/ilykesuga)\
**Post date:** [August 29, 2021, 12:14am UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/11 "2021-08-29T00:14:56Z")

</div>

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.
```

---

<div class="post-metadata">

**Author:** ![zaklina](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/zaklina/32/221235_2.png) [@zaklina](https://forum.freecodecamp.org/u/zaklina)\
**Post date:** [August 29, 2021, 12:31am UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/12 "2021-08-29T00:31:39Z")

</div>

> **[text-align - CSS: Cascading Style Sheets | MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)**
>
> The text-align CSS property sets the horizontal alignment of the content inside a block element or table-cell box. This means it works like vertical-align but in the horizontal direction.

---

<div class="post-metadata">

**Author:** ![zaklina](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/zaklina/32/221235_2.png) [@zaklina](https://forum.freecodecamp.org/u/zaklina)\
**Post date:** [August 29, 2021, 12:38am UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/13 "2021-08-29T00:38:41Z")

</div>

it is left:

```auto
 <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

---

<div class="post-metadata">

**Author:** ![Roma](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/roma/32/112899_2.png) [@Roma](https://forum.freecodecamp.org/u/Roma)\
**Post date:** [August 29, 2021, 2:13am UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/14 "2021-08-29T02:13:02Z")

</div>

@ilykesuga,  
Keep the test script when forking the pen (`<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></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](https://medium.com/better-programming/understanding-the-tags-in-html-boilerplate-38d1ae2805f7).

- Keep all your styling external. Do not use in-line styling.

---

<div class="post-metadata">

**Author:** ![ilykesuga](https://avatars.discourse-cdn.com/v4/letter/i/a9adbd/32.png) [@ilykesuga](https://forum.freecodecamp.org/u/ilykesuga)\
**Post date:** [August 29, 2021, 2:36am UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/15 "2021-08-29T02:36:51Z")

</div>

Roma,  
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.

---

<div class="post-metadata">

**Author:** ![ilykesuga](https://avatars.discourse-cdn.com/v4/letter/i/a9adbd/32.png) [@ilykesuga](https://forum.freecodecamp.org/u/ilykesuga)\
**Post date:** [August 29, 2021, 2:43am UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/16 "2021-08-29T02:43:32Z")

</div>

Honestly,  
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.

---

<div class="post-metadata">

**Author:** ![Roma](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/roma/32/112899_2.png) [@Roma](https://forum.freecodecamp.org/u/Roma)\
**Post date:** [August 29, 2021, 3:02am UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/17 "2021-08-29T03:02:47Z")

</div>

> [@ilykesuga](#):
>
> “Forking” the pen? I’m not sure what that means exactly.

The instructions say;  
“You can build your project by forking [this CodePen pen](https://codepen.io/freeCodeCamp/pen/MJjpwO).”  
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.

> [@ilykesuga](#):
>
> I tried to avoid inline styling but CSS was not working properly to style elements.

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.

> [@ilykesuga](#):
>
> but in code pen, the CSS syling that I’m using isn’t working

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.

> [@ilykesuga](#):
>
> I really don’t know what I’m doing.

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.

---

<div class="post-metadata">

**Author:** ![ilykesuga](https://avatars.discourse-cdn.com/v4/letter/i/a9adbd/32.png) [@ilykesuga](https://forum.freecodecamp.org/u/ilykesuga)\
**Post date:** [August 29, 2021, 5:39am UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/18 "2021-08-29T05:39:38Z")

</div>

> [@Roma](#):
>
> ( `<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>` )

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.

---

<div class="post-metadata">

**Author:** ![Roma](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/roma/32/112899_2.png) [@Roma](https://forum.freecodecamp.org/u/Roma)\
**Post date:** [August 29, 2021, 1:03pm UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/19 "2021-08-29T13:03:58Z")

</div>

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="https://www.biography.com/business-figure/steve-jobs>" </div>`  
Do you see the typo?  
HINT:

The closing quote for the URL is outside the angle bracket

> [@ilykesuga](#):
>
> I’m kind of determined though and I’m looking at other resources besides Free Code Camp to help me.

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

---

<div class="post-metadata">

**Author:** ![Jaydog](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jaydog/32/228784_2.png) [@Jaydog](https://forum.freecodecamp.org/u/Jaydog)\
**Post date:** [August 29, 2021, 1:25pm UTC](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713/20 "2021-08-29T13:25:36Z")

</div>

Hi  
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

[Next page](https://forum.freecodecamp.org/t/run-test-for-tribute-page/475713.md?page=2)