qr-code component

Community feedback

• 

  Melvin Aguilar 🧑🏻‍💻•61,140

  @MelvinAguilarPosted 11 months ago

  Hello there 👋. Good job on completing the challenge !

  I have some suggestions about your code that might interest you.

  • Wrap the page's whole main content in the <main> tag.

  • For a responsive and resizable component, consider using max-width: 320px for the width of the card and remove all the width of the body element

  • You can use the following styles to center the element effectively using felxbox:

    For Flexbox:

    body {
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      margin: 0px;
      padding: 0px;
      background-color: #D5E1EF;
      /* Remove this styles  */
      /* max-width: 0; */
      /* min-width: min-content; */
    }
    

    Later, you can remove this margin and add the max-width property:

    .all-text {
     max-width: 320px;
      /*   margin: 100px 800px; */
    }
    

  I hope you find it useful! 😄 Above all, the solution you submitted is great!

  Happy coding!

  2