QR code component using HTML and CSS

Community feedback

• 

  JuvoGenesis👾•2,010

  @AkoToSiJeromeEhPosted 6 months ago

  Hi there! Great work out there! I noticed that the QR Card component is not vertically aligned, and I recommend adding CSS properties to the body or specific element , such as d-flex and its related properties. Additionally, it's important to include min-height or height for proper alignment. By adding this to the body properties, you can achieve centering of the QR Card component. . I hope this suggestion helps and works for you. Happy coding!

  body {
    background-color: hsl(212, 45%, 89%);
    min-height: 100vh;   // add this
    display: flex;  // add this
    align-items: center;  // add this
    justify-content: center;  // add this
    flex-direction: column;  // add this
  
  }
  

  .container {
    width: 273px;
    align-content: center;
    margin: auto; // you can remove this
    text-align: center;
    padding: 15px;
    margin-top: 200px; // you can remove this
    background-color: hsl(0, 0%, 100%);
    border: 1px solid hsl(0, 0%, 100%);
    border-radius: 10px;
  }
  

  Marked as helpful

  0

  ---

  

  marlar•50

  @marlar-tzPosted 6 months ago

  Thank you for your helpful suggestion. I truly appreciate your input and will certainly explore it. @AkoToSiJeromeEh

  0

  

  JuvoGenesis👾•2,010

  @AkoToSiJeromeEhPosted 6 months ago

  @marlar-tz welcome i hope suggestion helps

  Marked as helpful

  0

  

  marlar•50

  @marlar-tzPosted 6 months ago

  Wow .It really helps .Thanks again @AkoToSiJeromeEh

  0