Skip to content
Submitted almost 2 years ago

QR code (desktop only) with CSS Grid

Wave•100
@JustWaveThings
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

  • How to get the heading text to break on "front-end" consistently without a <br> tag? I sacrificed matching the ending word to make the margins match.

Community feedback

  • Ms Amina•70
    @AmiyahayadevPosted almost 2 years ago

    Hello Wave, good job on getting this far!
    1.) Regarding your question, You can add a left & right padding to the text , try adjusting the value until it wraps the way you expect. 2.) Although you need to improve the Accessibility Considerations of your Solution. For Example: The heading “Improve your front end skills…” as you wrote <p>Improve your front-end skills by building projects</p> Should be inside a heading Tag : e.g < h1></h1> , this will require you to reduce the font-size to match the Solution. Remember to use rem unit for all fonts. Hope This helps

    Marked as helpful
    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