Build a tribute page stuck on 20%

I’ve tried moving the JS code out in to a separate JS file, moved my heading into the div id=main and also made the image responsive but it’s still stuck on 20%. I coded it locally and pushed it to github via git.

Here’s the link:

Is it because I used Git rather than CodePen? A Youtuber used the github link and it worked just fine.

HTML code:

		<link rel="stylesheet" type="text/css" href="style_sheet.css" />
		<link rel="stylesheet" href="" />

		<div id="main">
			<h1 id="title">Kobe Bryant</h1>
			<div id="img-div" class="w3-content w3-section">
					class="mySlides w3-animate-fading responsive"
					class="mySlides w3-animate-fading responsive"
					class="mySlides w3-animate-fading responsive"
					class="mySlides w3-animate-fading responsive"
				<p id="img-caption">
					"The most important thing is to try and inspire people so that they
					can be great in whatever they want to do."
				//slow mo images script
				var myIndex = 0;

				function carousel() {
					var i;
					var x = document.getElementsByClassName("mySlides");
					for (i = 0; i < x.length; i++) {
						x[i].style.display = "none";
					if (myIndex > x.length) {
						myIndex = 1;
					x[myIndex - 1].style.display = "block";
					setTimeout(carousel, 4000);

			<div id="tribute-info">
				Dear Basketball,

				<p>From the moment</p>
				<p>I started rolling my dad’s tube socks</p>
				<p>And shooting imaginary</p>
				<p>Game-winning shots</p>
				<p>In the Great Western Forum</p>
				<p>I knew one thing was real:</p>
				<br />
				<p>I fell in love with you.</p>
				<br />
				<p>A love so deep I gave you my all —</p>
				<p>From my mind & body</p>
				<p>To my spirit & soul.</p>
				<br />
				<p>As a six-year-old boy</p>
				<p>Deeply in love with you</p>
				<p>I never saw the end of the tunnel.</p>
				<p>I only saw myself</p>
				<p>Running out of one.</p>
				<br />
				<p>And so I ran.</p>
				<p>I ran up and down every court</p>
				<p>After every loose ball for you.</p>
				<p>You asked for my hustle</p>
				<p>I gave you my heart</p>
				<p>Because it came with so much more.</p>
				<br />
				<p>I played through the sweat and hurt</p>
				<p>Not because challenge called me</p>
				<p>But because YOU called me.</p>
				<p>I did everything for YOU</p>
				<p>Because that’s what you do</p>
				<p>When someone makes you feel as</p>
				<p>Alive as you’ve made me feel.</p>
				<br />
				<p>You gave a six-year-old boy his Laker dream</p>
				<p>And I’ll always love you for it.</p>
				<p>But I can’t love you obsessively for much longer.</p>
				<p>This season is all I have left to give.</p>
				<p>My heart can take the pounding</p>
				<p>My mind can handle the grind</p>
				<p>But my body knows it’s time to say goodbye.</p>
				<br />
				<p>And that’s OK.</p>
				<p>I’m ready to let you go.</p>
				<p>I want you to know now</p>
				<p>So we both can savor every moment we have left together.</p>
				<p>The good and the bad.</p>
				<p>We have given each other</p>
				<p>All that we have.</p>
				<br />
				<p>And we both know, no matter what I do next</p>
				<p>I’ll always be that kid</p>
				<p>With the rolled up socks</p>
				<p>Garbage can in the corner</p>
				<p>:05 seconds on the clock</p>
				<p>Ball in my hands.</p>
				<p>5 … 4 … 3 … 2 … 1</p>
				<br />
				<p>Love you always,</p>

			<div class="center">
					>Click here for Kobe's NBA career statistics</a

CSS code:

/* #image {
	max-width: 100;
	height: auto;
} */

/* .imageBorder {
	border-width: 10px;
	border-style: solid;
	border-color: purple;
} */

#img-caption {
	font-style: italic;
	font-weight: bold;
	color: white;
	text-align: center;
#img-div {
	text-align: center;
	/* padding: 10px; */
	background-color: black;

body {
	background-color: black;
	font-family: Arial, Helvetica, sans-serif;

#main {
	background-color: white;

#title {
	color: black;
	text-align: center;
	padding: 0.5px;
	font-weight: 700;

#tribute-info {
	margin: auto;
	text-align: center;
	background-color: black;
	color: white;
	width: 800px;

#tribute-link {
	margin: auto;
	text-align: center;
	font-weight: bold;

.center {
	margin: auto;
	width: 30%;
	padding: 10px;

.responsive {
	width: 100%;
	height: auto;

you can easily skip them if u dont want to complete those challenges

I want to complete them though

Welcome to the forums @marccodez. The link you provided is the generic pages for GitHub. When you set it up properly the entrance will have your userid, not github.
What do you mean you’re stuck on 20%? 20% of what? When you run the CDN it will give number for pass/fail.

Okay, I fixed your link. I see what you did.
Keep the test script when forking the pen (<script src=""></script>).

  • The test script should be included, with all tests passing, when you submit your project.

Since you don’t have the test script I don’t know what 20% means.

Hi Roma thanks for replying! I will try using codepen with the test script instead of git.

This is what I meant about the 20% complete.


Your code does not pass most of the required tests, for example having a welcome section with the id “welcome-section”.

You can fork this pen here: and paste your code there and run the tests for ‘Personal Portfolio’ and you’ll be able to see exactly what else you need to include to pass all the tests.

Oh that. Okay, there are five projects for you to complete. You’ve completed 1 project out of 5 projects. 20% of the projects have been completed.
You can still use GitHub. Just include the test script. It’s JS, put it right before the closing body tag.

1 Like

ohhhhhhh that makes so much sense!! Thank youuu you beaut!!