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 Page using HTML and CSS

Shay 20

@Shayinur

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


Thank you for reviewing my first project here at FrontEndMentor! To let the QR code box be positioned in the middle, in the media queries section, I manually typed https://github.com/Shayinur/QR_Code_Component to position it in the center. I wonder if there is a better way to do it? Thanks for your help!

Community feedback

Yokke 640

@Jexinte

Posted

Hey @Shayinur,

Good job ,

People can't see your work because in your html file you haven't add a dot and slash to your css path files that why your css file doesn't work on live site just before your styles folder.

When you need to center an element like a div in your case you can used flexbox like you've done on your qr_code div then using the property justify-content : center , use align-items : center with min-height : 100vh to have your element center horizontaly and vertically.

It's very useful thing that someone learned me on one of my previous challenge.

You can learn more efficiently flexbox with this game if you liked this kind of learning :

https://flexboxfroggy.com/

Or you can check this sir it's seems that he is a kind of master in css so he can help you a lot on Youtube for flexbox , grid and more :

https://www.youtube.com/kepowob

In hope it helps !

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