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

Static webpage with QR code

Joey Salinasā€¢ 10

@JoeySalinas12

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


  • The submission format took some getting used to, but overall there was not too much difficulty in this project.
  • I could definitely use some practice using CSS.
  • One question: When incorporating javascript files, do those usually sit in their own folder or are the just referenced from the root folder?

Community feedback

Daniel šŸ›øā€¢ 44,270

@danielmrz-dev

Posted

Hello @JoeySalinas12!

Your project looks great!

  • Using margin is not the best option to center an element. Here's a very efficient (and better) way to place an element in the middle of the page both vertically and horizontally:

šŸ“Œ Apply this to the body (in order to work properly, don't use position or margins):

body {
    min-height: 100vh;
    display: flex;  /* it works with grid too  */
    justify-content: center;
    align-items: center;
}

I hope it helps!

Other than that, great job!

Marked as helpful

1
P
Raphael Perfiā€¢ 230

@perfidev

Posted

Usually, you will separate the files into their own folders. Example of simple separation:

  • img (for images)
  • css (for css files)
  • js (for javascript files)
  • index.html

Marked as helpful

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