There are a few things I had trouble fixing.
For example:
Candles pic I want to span the entire width of the screen.
I also think I am having some trouble clearly organizing my code. If someone can look into that and give me feedback I would much appreciate it.
God Bless.
It is good but I would recommend some more padding between the box edges and the text.
I think the candle image is too big and takes a long time to load. Also it is taking up space to the right of the browser view. I think a smaller image here would improve it greatly.
In general the layout needs some improvement. Then it will be a very god tribute. 
Sorry to hear about your friend Jasminder pal. It’s often a hushed-up issue in the Sikh community. As for your page, I agree with the other comment that the candle image occupies basically the whole viewport (on codepen at least). I honestly thought that was all you had at first. And given the purpose, you want the picture of you three to be the centerpiece, and not require scrolling.
If you want to organize your code (proper indents and all that), in every pane (HTML/CSS/JS), you can “tidy” the code, by click the down-carat and selecting it from the drop-down that appears (Before):
Image:
opacity property, so that it fades.Good luck!
Thanks for your comments! Yes, the candle image is too damn big, I know haha. I wanted it to span across the screen and it ended up becoming way to big.
I will play around with the passing and see what i can modify.
Thanks a lot, I appreciate it!
Bro! Wow, you gave me so much feedback. I want to sit infront of my Mac and filter through each part you wrote me step by step. That is exactly what i needed. I am using Bootstrap because it was required for the task I did for the tribute page on freecodecamp. To be honest, its all still taking time to sink in (everything i have learned I mean). The requirment was to also write code in html exclusively.
I agree, the text is so small. I had a lot of trouble trying to center text, change font sizes and changing fonts while working on this.
You gave me SO much info, I truly appreciate that.
–
And yes, it is very taboo, not only in the Sikh community but in many communities. JP was an awesome guy.
Ah: I also thought Bootstrap was necessary to complete it, based on the instructions I read on the production site at: freecodecamp.org. It confused me too. I ended up writing the tribute with Bootstrap, and understanding little despite reading a lot about it on their documentation site. At my first meetup like two weeks in, I talked to a senior developer who also began with FCC, and he told me to use the Beta instead. Even though you need a new login, and your work won’t be duplicated, the Beta site: beta.freecodecamp.org takes you through the fundamentals using raw HTML and CSS. That’s all you need to complete that first series of challenges. I even refactored the code for my portfolio to make it with just HTML and CSS. I am SO glad I listened to Daniel (the senior dev), put aside my sense of “having wasted work,” and just started over with the Beta. By hand-typing everything again (never copy/pasting), I feel that doing it twice made me much more sure and quick when I code. My first series of projects ended with a portfolio that uses no bootstrap. (The Beta curriculum does cover Bootstrap, but much later, when we already understand the fundamentals). Learning flexbox and grid lets you do much of the same stuff anyway. Make the jump, begin again. You will fly through the lessons that are basically the same, and the rest of the curriculum is much more robust and up-to-date. A minor argument could be made about reordering the modules in the Javascript section, but feel free to message me when you get there if you want advice about how to use that section.
Also, don’t be afraid to look stuff up. And again. And again.
For HTML/CSS help, I would often google:
“w3 html TOPICNAME”, or
"w3 CSS TOPICNAME" - for example "w3 center text"
They have a great “Try it” functionality that lets you see the code and the result side-by-side, as well as change things and re-run the code to see what changes. This is how you really learn to code. There is no truer joke than this one about programming. I remember getting it as an undergrad on an email chain.
Once you get to Javascript, you can move on to the Mozilla Developer Network. Learn to use the “Syntax” section to see what goes into and out of every function, just like math functions, where:
y = f(x)
return value = function (parameters)
Wow, this is a very moving tribute to your friend, he sounds like a great guy. I almost don’t want to critique something so personal (and @vipatron has already given a ton of great advice). Great job on the project and on helping to spread an important message that needs to be heard more.
Hi @vipatron, I printed your last comment and posted it on my cork-board. I am going to do everything you said step-by-step. You hit the nail on the head when you said being quick when I code, because I felt SO lost when I started and I literally googled everything. I will do the beta.freecodecamp.org series and type it all. You are right, it will make me sure and clear of my code without wasting time googling things in order to get something simple to work. I do not mind doing it all over again because I am in no rush, although I do want to progress efficiently and not delay. In addition, doing the beta fundamentals a second time is going to help me understand what I did already, because I was almost following the tutorials like a zombie and half the time not sure what they exactly meant. I think that now I did my first actual page from scratch, I am going to learn a lot going about it the second time around. Fail faster, succeed sooner.
Thanks again!
I’m going to steal that for my students: “fail faster, succeed sooner.”