QR Code Component

Community feedback

• 

  SanCross354•30

  @SanCross354Posted about 1 month ago

  Hello Mr. Shoaib. You've done a great job at completing this challenge 😎. There're some advice for your QR Project, such as :

  1. When it comes to semantic HTML, it'd best to replace <div class ="main"> with <main> tag for better semantics. Then u put <strong> inside an <h2> is unnecessary because <h2z> already emphasize the text (it means u can change it from <h2> to <h1> as the primary heading
  2. Your <img> tag has an empty alt atribute and this's gonna make it unreadable for screen readers if suddenly the image can't be loaded. You should add alt description.
  3. There're issues with Layout & Responsiveness. Using margin-left: 40% didn't make our card to be centered on smaller screens. It'd be good if you utilize flex or grid for centering. In your css file, you already used align-items: center and it's ineffective because it only works in display: flex
  4. The QR image's not responsive because you set it at 255px that could be broken on smaller screens. You can use width: 100% and adjust the container

  Marked as helpful

  0