Tribute Page, legendary spanish rocker 🎸 - Hope your feedback

Code Feedback
1

Hello everyone, I just finished the first project of the Responsive Web Design Certification. For this I have made a web tribute to a legendary Spanish rocker. I hope to receive your feedback and suggestions about it! Thank you :wink: :wink:

https://codepen.io/rubdev/full/RYygrr/

1 Like
2

Well done, I like your styles a lot! I would

make your title bigger.
Give some line-heights to your paragraphs for readability.
Do a color change on your link when mouse hovers on it.

Good luck!

3

Thanks, your comment has been helpful, I will try to improve the adjustments you tell me.
Regards! :grinning:

4

A little problem with the headings at above 1025px
h1

also at above 775px and persist as you shrink the window furthur
h2

5

hi I’ve been reviewing what you tell me and it is true that it was mismatched in some resolutions, the truth is that after reviewing it I see that the main resolutions (iphone, ipad, laptop) are displayed well but sometimes misalignments occur and I do not know how To solve them, I would be grateful if someone could help me.

6

Hey there, sorry for replying late.

the problem is you have defined <h2> width in percentages which varies with the viewport size, however, the font-size of <h2> does not change. Possible solution to fix this could be:

  • to define static widths i-e in px
    OR
  • A better would be to leave the width to be as it is, just define Padding 
h2 {
  background-color: black;
  color: white;
  display: inline-block;
  padding:10px;
}

Try this , you would understand better. This would eliminate the need of media-queries for <h2>.

Hope this would be helpful.