QR code component using HTML and CSS

Community feedback

• 

  Vanza Setia•27,775

  @vanzasetiaPosted over 2 years ago

  Hello, @Meteo-Flagyl00! 👋

  Congratulations on completing your first Frontend Mentor challenge! 🎉

  There are a lot of things that you can improve.

  • First, I recommend using flexbox to position to the middle of the page. position: fixed makes the card out of the normal flow. As a result, it makes it hard to style.
  • The only thing that the card needs to be responsive is a max-width. You only need to prevent the card from becoming too large on a wide screen. For the height of it, let the content inside it dictate it.
  • If all the values of the padding are the same (padding: 10px 10px 10px 10px;), you can make it shorter by writing it like this: padding: 10px;.
  • I recommend improving the alternative text of the QR code to "QR code for frontendmentor.io". It's going to give the users clear information about the QR code.

  Overall, great work. You manage to keep the specificity of the CSS as low as possible. So, keep learning and happy coding! 😄

  Marked as helpful

  1

  ---

  

  FrontNewBie•50

  @Meteo-Flagyl00Posted over 2 years ago

  Hello, @vanzasetia Thank you so much for your time brother, I knew I had a lot of things that I need to work on I just didn't know what are they. I will try to work on the things u pointed out in the next challenges , and once again thank u so much for your time.

  0

  

  Vanza Setia•27,775

  @vanzasetiaPosted over 2 years ago

  @Meteo-Flagyl00 No problem! 👍

  0