Puzzling Tribute Page

Code Feedback
1

HI guys!
So I built this yesterday and thought everything is okay till I ran the test…
Its 8/10. I’ve looked through my codes again and again and made some changes, also analysed the HTML, CSS and JS and they’ve nothing wrong in them.

Anyone can enlighten me why??

Thanks heaps

2

your pen is missing the test script

can you add it back?

also remove the <head> block entirely for the purpose of codepen.

3

Thanks hbar1st…

Now its 6/10 test! Gahhhhhh what did i do wrong :frowning:

4

so the last link you shared is an empty page.

Not sure why you shared that…
I was suggesting you fix your pen , not create a whole new one.

ie. remove this code:

<head>
	<title>Lee Kwan Yew tribute</title>
	<link rel="stylesheet" href="LKY.css">

</head>

and add:

<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>

this line back to your html

Once that is done you will have 8 out of 10 passed test. The remaining errors are:

  1. I should see an element with a corresponding id=“tribute-link”, which links to an outside site that contains additional information about the subject of the tribute page. HINT: You must give your element an attribute of target and set it to “_blank” in order for your link to open in a new tab (i.e. target="_blank"). AssertionError: expected null to not equal null

and

  1. The element should responsively resize, relative to the width of its parent element, without exceeding its original size. AssertionError: Use the “display” style property with a value of “block” forresponsive images.: expected ‘inline’ to equal ‘block’

For the first issue, just add the missing id of ‘tribute-link’ to your a tag (that links to wikipedia)

5

So, you have some missed user stories like:

7. I should see an <a> element with a corresponding id="tribute-link", which links to an outside site that contains additional information about the subject of the tribute page. HINT: You must give your element an attribute of target and set it to "_blank" in order for your link to open in a new tab (i.e. target="_blank").

To solve this you need to add the requested id to this:

<a href="https://en.wikipedia.org/wiki/Lee_Kuan_Yew" target="_blank">Wikipedia page</a>
6

My apologies… I realised I didn’t save the pen before sending the link.
I’ve updated the pen. I checked it in Safari and Chrome… same story. Sigh…

7

and to fix the last issue all you need is:

img {
display: block;
margin-left: auto;
margin-right: auto;
}

8

As for the #image you need to make it a block element and you will pass all tests

10

I got it!!

Thank you guys so much. For being patient and kind.

#image {
display: block;
margin-left: auto;
margin-right: auto;
max-width: 80%;
height: auto;
border-radius: 25px;
}

2 Likes