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 page display using css

@NithishSaran04

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?

Learnt many new things while practing.

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

I learnt to break and start a new line within paragraph using and positioning in css.

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

There are lot of topics for me to be covered.

Community feedback

Bryan Li 3,550

@Zy8712

Posted

Hi there! Your site looks pretty solid and is quite similar to the original design. Nice work!

Some changes I would personally recommend:

  • instead of giving your card position absolute and centering it using left & translate, you should use flexbox
  • to use flexbox just go to the parent container, which in this case is your <body>, then you can do something like:
body{
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   min-height: 100vh;
}

Flexbox is a important concept/skill in css. To learn more about it I recommend this video.

Hope you find this feedback useful 👍

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