Skip to content
Submitted 6 months ago

QR code

Aaron Smith•280
@medic-code
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

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

Getting the flex box centered

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

Getting the flexbox centered, i asked chatgpt which give me a hint in terms of height being the 100% of the viewport for the flex container to center the box without padding and margins.

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

Semantic HTML, CSS styling

Community feedback

  • Seung Kim•30
    @seung0708Posted 6 months ago

    Sorry, @medic-code! I didn't really read this section. Great work!

    0
  • snhaydar•20
    @snhaydarPosted 6 months ago

    Aside from the background color difference, it looks great! It's interesting that you used a flex box, I didn't think to do that!

    0
    Aaron Smith•280
    @medic-codePosted 6 months ago

    Yeah I tried to use the hsl colour in the design but it really didn't look like the design at all so choose something that allowed you to see the card clearly. @snhaydar

    Thanks for taking the time to comment!

    It might be a bit over kill to use flexbox but for any columns or rows you can use flexbox. Using CSS Grid for large scale layout and flexbox for local layout.

    This card is a bit weird because its just in the middle of the page which would be unlikely to be what you'd do for a full website lay out.

    0
  • Seung Kim•30
    @seung0708Posted 6 months ago

    I think my solution comes really close to the design.

    0
    Aaron Smith•280
    @medic-codePosted 6 months ago

    Thanks for your input @seung0708

    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