HTML + CSS

Community feedback

• 

  hitmorecode•6,360

  @hitmorecodePosted about 1 year ago

  Nice well done. Just a few tips

  • Change the width of the card to 300px. Width of 20% will not working when going to smaller screen size.
  • To place the card in the middle of the page use flexbox on the body (see modifications for the body below)
  • You can remove margin: 7% auto; on the card, flexbox on the body will do just fine
  • Make it a habit of using min-height: 100vh; on the body. This will make the page responsive

  body{
      background-color: hsl(212, 45%, 89%);
      min-height: 100vh;
      display: flex;
      justify-content: center;
      align-items: center;
  }
  .card{
      background-color: hsl(0, 0%, 100%);
      width: 300px; 
  /*     margin: 7% auto; */
      padding: 14px;
      border-radius: 13px;
  }
  

  0

  ---

  

  Suvankar Pradhan•670

  @suvankarpradhanPosted about 1 year ago

  @hitmorecode Thank you for your suggestion 👍

  0