QR-code-component with css

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  👾Hello Kira Weizman, congratulations on your first solution!👋 Welcome to the Frontend Mentor Coding Community!

  Nice code and nice solution! You did a good job here putting everything together. I’ve some suggestions for you:

  1.For a better alignment use instead min-height: 100vh to the body to make sure the body size is 100% of the viewport.

  2.Clean your code by removing some unnecessary divs, most of the content can stand alone without a div. Use div only for blocks that need a special alignment or the content needs a special positioning.

  3.Use relative units like rem or em instead of px to have a better performance when your page content resizes on different screens and devices. REM and EM does not just apply to font size, but all sizes as well. To save your time you can code your whole page using px and then in the end use a VsCode plugin called px to rem to do the automatic conversion or use this website https://pixelsconverter.com/px-to-rem

  ✌️ I hope this helps you and happy coding!

  Marked as helpful

  1

  ---

  

  Kira Weizman Shapira•90

  @kiraweshPosted about 2 years ago

  @correlucas Really appreciate your feedbacks, thanks so much for that.

  1. Fixed that, although I would appreciate to understand the difference and why this min-height: 100vh is the best method.

  2. Do you mean by main and article tag? Actually I wanted to solve the accessibility issues, and found that is it not the best solution. Second thought was to make containers, because I found that the content, is different size from body grid. So I wanted to make it correct.

  3. I agree with you, need to get used to it. I didn't know there was this plugin, it really helps.

  1