Skip to content
Submitted about 1 year ago

QR code component

Karl Davis•270
@TKD5
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...QR code component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

This is my version of the QR code component project. I added a media query to size it to mobile size (320px). However, I'm still getting use to media queries.

Any advice would be greatly appreciated.

Community feedback

  • Christopher Castaneda•90
    @chrisdcastPosted about 1 year ago

    It's looking most of the way there! Some suggestions I would make:

    • The fonts in general seem to be a little large. making them smaller might help with the overset text in the QR card.
    • The image is also overset. You can remove the height style and replace it with a: width: 100% and it looks like that might fix it.
    • I might recommend setting your breakpoint to something a little higher. The style guide recommends at least 375px, but the bootstrap guide for breakpoints sets a 'small' screen size as anything below 768px.
    0
    Karl Davis•270
    @TKD5Posted about 1 year ago

    @chrisdcast Thank you very much for your advice. I really appreciate it. Trying to determine which breakpoints are best is a little confusing as there are so many suggestions / recommendations.

    0

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord