QR-code-component (HTML + CSS)

Community feedback

• 

  Saulius K.•560

  @TH3RIVPosted almost 2 years ago

  Hi, @nerdy-guy!

  You can very easily center your container using flexbox or grid on the parent container:

  body {
     min-height: 100vh;
     display: flex;
     align-items: center;
     justify-content: center;
  }
  

  or

  body {
     min-height: 100vh;
     display: grid;
     place-content: center;
  }
  

  This way you do not need to use margins to center you containers, it centers it in the parent container.

  Also try to avoid using px values as much as possible and use rem instead.

  Hope this helps!

  Marked as helpful

  2

  ---

  

  Ahmed Arafa•120

  @nerdy-guyPosted almost 2 years ago

  @TH3RIV Thanks for your feedback, it was very helpful.

  0
• 

  Adriano•38,390

  @AdrianoEscarabotePosted almost 2 years ago

  Hi Ahmed Arafa, how are you? Welcome to the front-end mentor community! I really liked the result of your project, but I have some tips that I think you will enjoy:

  To improve the responsiveness of the project, we are going to make some changes to the project:

  .container {
      max-width: 330px;
      width: 100%;
  }
  img {
      max-width: 300px;
      width: 100%;
  }
  

  The rest is great!

  I hope it helps... 👍

  Marked as helpful

  1

  ---

  

  Ahmed Arafa•120

  @nerdy-guyPosted almost 2 years ago

  @AdrianoEscarabote Thanks for your feedback, it's a lot better now on smaller screens.

  1