Mobile first Qr Code Component Challenge with HTML and CSS

Community feedback

• 

  Dev Rathore•2,600

  @GitHub-dev12345Posted over 2 years ago

  Congratulation to complete the challenge ❤️👍 My small suggestion : 1.In Card design CSS Code Used this:

  transform : scale(0.8); this property decrease the size of card. 😉

  large size for increase the number of scale & small size for decrease the number of scale

  And give the heading font-size; normal to fit the heading in the card, and same in paragraph

  I hope you find this helpful

  Marked as helpful

  1

  ---

  

  Luka Velijević•70

  @Git-LuxPosted over 2 years ago

  @GitHub-dev12345 Thank you for taking the time to review my code and give feedback :) Will keep that in mind when I'm doing my next challenge

  0
• 

  P

  Fluffy Kas•7,715

  @FluffyKasPosted over 2 years ago

  Hey there,

  Well done on completing your first challenge! :) I have a few suggestions on how you could improve this:

  1. You could wrap everything in a main tag. This being just a small component it's not a big deal if you don't, but if the accessibility issues in the report bother you, this would help to get rid of them. It's not a bad idea to get used to paying attention to this anyway, for later projects.

  2. You left the alt text blank. This would be fine if the image was decorative, but in this case it's a functional QR code so perhaps giving it an alt text of "QR code." would be a good idea!

  3. Font-size reset of 15px: I wouldn't recommend hardcoding a px value here as this will cause an issue for users wanting to change their browser's default font size (if your website is using px values, your content won't rescale). Instead of a global reset, why don't use set your heading and paragraph font size separately in relative units (em, rem, etc)?

  4. If you used max-width on your container instead of width, you could get rid of the media query altogether. I'd also go for something smaller than 500px.

  1
• 

  PhoenixDev22•16,950

  @PhoenixDev22Posted over 2 years ago

  Greeting @Git-Lux ,

  AS @FluffyKas recommended . Also try to put classes directly on anything you want to style.

  Hopefully this feedback helps.

  0
• 

  Dev Rathore•2,600

  @GitHub-dev12345Posted over 2 years ago

  Good 👍

  0