Skip to content
Submitted 7 months ago

QrCodeComponent

Fouratidaniā€¢10
@Fouratidani
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?

I'm proud that I finished it in just a couple of hours without getting lazy towards completing the challenge. Next time, I would implement a CSS framework to simplify my work.

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

the main challenge for me is that i had to make it look like the original , and thats really tough

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

I want to obtain the actual sizes of the components and possibly a simpler and more understandable code alternative to mine.

Community feedback

  • Daniel šŸ›øā€¢44,250
    @danielmrz-devPosted 7 months ago

    Hello, @Fouratidani!

    Your project is looking fantastic!

    I'd like to suggest a way to make it even better:

    • Using position isn't always the most effective method for centering an element.

    Here's a highly efficient approach to position an element at the center of the page both vertically and horizontally:

    šŸ“Œ Apply this CSS to the body (avoid using position or margins in order to work correctly):

    body {
    min-height: 100vh;
    display: flex; 
    justify-content: center;
    align-items: center;
}

    I hope you find this helpful!

    Keep up the excellent work!

    0
  • Oladimeji Adeyemoā€¢60
    @Holardev19Posted 7 months ago

    This is a nice attempt, Fourat. Keep it up!! You got the exact background color of the body and centered the container well. I see you used a different color for the container background color. All the same, a good attempt.

    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