My Hello / Tribute Page to Arnold Schwarzenegger

Hello! Its my first topic/post here and first of all I wanted to say Hello to Everyone!

I just finished building my first Tribute Page and my first web page overall. I’m pretty happy about that fact and wanted to share it, so I could get some feedback. I am really happy that I found FreeCodeCamp because thanks to you guys I was able to finally start doing some meaningful code and build something of my own - even as small as a tribute page.

Thank you in advance for any feedback!

https://codepen.io/Kielx/pen/pXMarM

It’s a good looking page. But, the tests don’t check to see that your HTML is valid(correct). You’re supposed to do that.

The only tags outside of body are head and html. Codepen is a unique environment that enables really crazy markup to work ( not saying yours is crazy, I’ve seen some way out there stuff). It’ll look a little different somewhere else.

You use #timeline twice. Each id should be unique.

Really good looking though.

Hey there Tlc35us, thank You for your feedback I really appreciate it, but some stuff is still unclear to me. What tests do you mean? Because it passes all of the FCC tests. I had some trouble with the div with id main, which was supposed to contain all other elements and I was unsure where to put it exactly.
About the #timeline - yeah it seems I missed it. Will fix that when i get back home from work.
Thanks once again for your feedback!

The tests only check for project requirements. They don’t test to see if your HTML is accurate like closing your tags and putting them in the right order. Just that you are supposed to check and fix your own mistakes.

I understand what you mean. I have reformatted the page as best as I could and uploaded it to github pages - https://kielx.github.io/FCC-Tributepage-Arnold/. I also adding shrinking navbar for smaller screens.
Thank you once again for you feedback!

You’ve got some great information on there.

I think that long, long timeline, for me, is a bit too long, even longer on a phone. how many phone screens is it? Perhaps you could pick 10 or so major events, or divide it into a table of decades, just to break it up a bit. When viewing with a 1920px wide monitor, it is a long way to read from left to right.
The nav bar is a nice addition.

On Galaxy S9 view in Firefox, the city names are clipped. You could make the element fill the width of small screens.

Hey Leebut thank you very much for your feedback!

Regarding the clipped city names - thats the feature of responsive bootstrap table. There’s a scroll bar at the bottom of the page, because otherwise the table wouldnt fit the screen.

And regarding the timeline - that was a great tip. I decided to split the timeline into three parts and use accordion style for it - and I think that it looks a lot better thanks to your suggestion!

The updated version is available at github pages because its easier for me to edit it with vscode and get familiar with git instead of being stuck with codepen.

https://kielx.github.io/FCC-Tributepage-Arnold/