Stats Preview Card Component

Community feedback

• 

  Hassia Issah•50,670

  @HassiaiPosted almost 2 years ago

  Replace <div class="card"> with the main tag and <h2> with <h1> to fix the accessibility issues. click here for more on web-accessibility and semantic html

  There is no need to give the body a width value.

  To center .card on the page, add min-height:100vh; display: flex; align-items: center: justify-content: center; or min-height:100vh; display: grid place-items: center to the body.

  To center .card on the page using flexbox:
  body{
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  }
  

  To center .card on the page using grid:
  body{
  min-height: 100vh;
  display: grid;
  place-items: center;
  }
  

  Change the value of the background-blend-mode to multiply, there is no need to style the img because there is no img in the html file.

  Hope am helpful.

  Well done for completing this challenge. HAPPY CODING

  0