qr-code solution by html css

Community feedback

• 

  P

  Kuvashnee Naidoo•450

  @KuvashneeNaidooPosted about 1 month ago

  Hi Han Hyungu. Excellent work on this QR code component! 🌟😁🌟 It reflects the design for both large(web) and small(mobile) screens.

  To address your questions:

  1. Using px (pixels) is fine here since the QR code is a small, fixed element that doesn’t need to adjust with screen size. Note that px is an absolute unit, representing one screen dot, which provides precise control over sizing. In the case of the QR code component, the precision of px ensures that the element looks exactly the same size on different screens.

  2. However, using px for layout and styling in more complex components can cause issues with responsiveness, as pixel values are fixed and don't adapt to different screen sizes. For better scalability and flexibility, it's recommended to use relative units like:

  • em or rem: These are based on the font size, and they scale more easily.
  • %: This helps scale elements relative to their parent container, making them more adaptable.
  • vw and vh (viewport width/height): These units are based on the size of the viewport, so they can scale dynamically as the screen size changes.

  Overall, you can still use px for small, fixed elements (like borders or shadows), but rely more on relative units for better responsiveness.

  I believe this article could be particularly helpful: CSS Units – When to Use rem, em, px, and More

  I hope this helps! Happy coding :) 🚀🚀🚀

  Marked as helpful

  1

  ---

  

  han hyungu•80

  @hyuyu1012Posted about 1 month ago

  @KuvashneeNaidoo Your answer was really great and very helpful. Thank you!!!!!!

  0