Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

QR code - my first attempt using Flexbox

darkogj 10

@darkogj

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

I figured out how to vertically center the card.

What challenges did you encounter, and how did you overcome them?

Vertically centering.

What specific areas of your project would you like help with?

Alternatives approaches for both horizontal and vertical centering.

Community feedback

@rodrigoronin

Posted

Hello @darkogj,

By reviewing your project I have some advices that can help you improve.

Try to separate the content of your page in blocks, for example, in the challenge we have a main section to handle the content and inside it we have an image and some texts. You could have created a div to wrap the image and on for the texts, it would be better for maintenance:

<main role='main'>
  <div class='main-content'>
    <div class='qrcode'>
      <img>
    </div>

    <div class='texts'>
      <h1>Big text</h1>
      <p>Small text</p>
    </div>
  </div>
</main>

With time and practice you'll learn how to structure your pages.

0

Please log in to post a comment

Log in with GitHub
Discord logo

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