Tribute Page - All Feedback Welcome

Code Feedback
1

Hello! This is my first tribute page and although I am still not done adding content, I know there are a lot of things that can be improved upon HTML/CSS wise. In the Black Mamba section, I would like to get the 3 li points indented, and I used several br lines in order to separate the following section. I’m sure there is an easier way to do that. I will continue to add content and work on it, but any and all feedback is welcome. I just want to get better, so send anything you got my way!!

2

Congrats on your first project. I would recommend that if you know there are issues that you go ahead and fix them without waiting for us to tell you what you already know :slight_smile: If you run into a problem fixing them then you can ask a specific question about that.

One thing I will mention right now is that the text is very hard to read on that background. You will need to add a solid background color behind the text so that it is easier to read. Also, I would put a max-width on the content to keep the line length reasonable. I think anywhere between 40-50em should do the trick.

Good luck.

3

Hey thanks! Yeah it’s definitely a work in progress still, but the feedback you gave is exactly what I was looking for. I’m just looking for perspectives different from my own, and if there’s anything you think I could add, or anything I’m missing, or anything I could change.

So with that being said, I see your comment about the background, and I was hoping to use that one because it’s from Kobe’s video, but I definitely see your point about the color, particularly in spots where it is dark. So let me ask you this: if I lightened the background, do you think it would suffice, or just scrap it all together? Also, when you say put a max width, do you mean to put that on the Main content?

And last question: in my “Black Mamba” section, there are three bullet points that are under the “2005-2006” bullet that I would like to indent, while still keeping the picture on the left hand side. Is there anyway to do that?

4

Welcome to the forums @amichel1091. Since this is a work in progress I’ll be brief;

  • Keep the test script when forking the pen (<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>).
    • The test script should be included, with all tests passing, when you submit your projects.
    • Your page passes 9/10 user stories. Click the red button to see which test(s) are failing and text to help you correct the issue.
  • Codepen provides the boilerplate for you. It only expects the code you’d put within the body element in HTML. (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.
    • Mentioning because you have elements out of order. Everything the browser displays belongs in the body element.
  • Do not use the <br> element to force line breaks or spacing. That’s what CSS is for.
    • Instead of using <br> elements to have each inline element on a new line, use or set container elements to be block-level elements so they’ll each take up the full width.