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 with HTML and CSS

@auri222

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?

  • Maybe the part in the code that I am proud of is the way I can use Flexbox to achieve the outcome that I want and with the help of the calc function to create the footer part at the end of the page for an appropriate look. But as you can see the HTML structure is a bit messy.
  • Next time I will use CSS grid for this challenge.

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

  • The footer part made me think hard and had to try a lot of ways to achieve it.
  • Using Flexbox can help stack 2 components as a column, but then the container that includes the QR box will only have the height of the QR box, so I had to calculate the height of the footer and used the calc function to achieve the container height as the way shown in the page.

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

  • If the result is shown as the page that I coded, which way would be the best approach?
  • I hope to hear your idea on this.

Community feedback

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