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

Responsive QR code component using CSS Flex

Chiamaka Uyannaβ€’ 40

@chiamakauyanna

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?

When I first started learning HTML and CSS it seemed impossible at first but I am proud that this project was completed without difficulty.

I am proud of my growth so far and wish to get better and better

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

I had a bit of an issue when it came to placing my div at the center. It hasn't been much of a problem to me but the styling I added made it difficult for my div to flex and align center.

Community feedback

MikDra1β€’ 6,050

@MikDra1

Posted

To easily Center the component I encourage you to use this solution:

Create a container element first, then write this code on the container.

CSS

display: grid; place-items: center; min-height: 100vh;

If this comment was useful please mark it as helpful ❀️

Good job and keep going πŸ˜πŸ‘β˜ΊοΈ

Marked as helpful

1

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