Tribute Page - Some Feedback

Code Feedback
1

Thanks for taking a look… https://codepen.io/aetones/pen/MWazQNy

Any tips to improve would be appreciated.

2

Hi @aetones

Thank you for the opportunity to comment on your project.

Just a couple of things to work on.

  1. Try putting the paragraphs in individual divs. That way you could have them one on top of the other on all devices.

  2. The video is set to be on a specific width. Try setting the media query for mobile at 100%, the video, so it doesn’t exceed its parents element.

Have you worked with media queries before?

3

Hi there!

You might want to copy/paste your code into a validator such as those on W3 here: https://validator.w3.org/#validate_by_input

I’m fairly new myself, but it looks like you’re getting a fatal error tied to your html element. Removing the id seems to fix it, but there’s other errors after that it can help you fix.

4

Your page looks okay @aetones but there is something you need to revisit;

  • codepen provides the boilerplate template 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 <head> click on the ‘Settings’ button, then HTML and add it into the ‘Stuff for <head>’ box.
    • Everything the browser renders belongs in the body element. You have elements thrown about that can potentially cause some browsers to fail when rendering your page.
    • move the media query that someone gave you to the CSS section
      After you clean it up then run it through the validator that was mentioned.

Use Google to see how elements go in an HTML page. But as mentioned, you don’t need to put them all into codepen.
Briefly, it will look something like;

<!DOCTYPE html> 
  <html> 
    <head>  
      <meta charset="utf-8"> 
      <title></title>  
    </head> 
    <body>  
      <!-- code the browser renders --> 
    </body>  
  </html>
5

Need to design improvement.

6

Thanks for the advice. I haven’t worked with media queries other than what was shown on the fcc tutorials. I’m going to look into in more.

1 Like
7

I didn’t even know about this lol thanks…looks like I have a lot to work on.

8

I have been trying to improve on it, will be updating it soon. Thanks for all the pointers, really shed some light on what I need to get done.