My tribute page project, please leave feedback

This is my first tribute page for the project. I just started coding roughly less than a week ago so I don’t expect it to be perfect. Please let me know where I can improve and what I did right. Also I would really appreciate any tips on organizing my code better and making it compatible for all devices. Thank you.

Hi Mendes0010,

This code is more readable in an external file (the css tab in codepen):

<style>
  body {
    background-color: rgb(255, 255, 255)
  }
    
  .logo {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
  h1 {
    font-family: 'Rock Salt', cursive;
   
  }
  .red-text {
    color: red;
  }
  .black-text {
    color: black;
  }
  p {
    font-size: 25px;
  }
  .grey-background {
    background-color: grey;
  }
  .smaller-image {
    width: 227px;
    height: 300px;
  }

</style>

The 'align' attribute is no longer valid on the "h1" element and should not be used.
<h1 class="red-text " align="center"><b>The Band that formed Death Metal</b>
    <br></br>
    </h1>

MDN documentation


This code is not correct:

<h1 class="red-text " align="center"><b>The Band that formed Death Metal</b>
    <br></br> <--here
    </h1>

MDN documentation:

The HTML element line break
produces a line break in text (carriage-return). It is useful for writing a poem or an address, where the division of lines is significant.
Do not use <br> to increase the gap between lines of text; use the CSS margin property or the <p> element.


You can use CrossBrowserTesting with codepen:
https://blog.codepen.io/2014/12/15/test-pens-browser-live-free-crossbrowsertesting-com/


I think the logo and the font of the h1 are great, you only need to keep making projects :thumbsup:

Cheers and happy coding :slight_smile:

1 Like

Thank you very much for the feedback, it’s greatly appreciated. Going to make some needed corrections!

1 Like