Profile Card Component

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  👾Hello Kenisa, Congratulations on completing this challenge!

  I saw your preview site and I liked a lot the work you’ve done here, it's almost complete, I’ve some suggestions you can consider applying to your code:

  1.There's no need to set the container height the height its automatic and the container grows with the size/spacing of its content. If you set the height the container will stop to grow after reach the height set:

  .card {
      background-color: var(--white);
      border-radius: 1rem;
      width: 100%;
      /* max-height: 23.5rem; */
  }
  

  2.When the card gets stretched the stats section gets a little bit too near and not fitting good together, something you can do to improve the card responsiveness is create a media query for the stats section and make each stat number stay in a different row after max-width: 350px using a media query, here's the code for that:

  @media (max-width: 350px) {
  .stats-list {
      display: flex;
      flex-direction: column;
      justify-content: space-around;
  }
  }
  

  ✌️ I hope this helps you and happy coding!

  Marked as helpful

  0

  ---

  

  Kenisa•90

  @KenisaReneePosted about 2 years ago

  @correlucas Awesome! I'll give your suggestions a try. Obrigada

  1

  

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  @KenisaRenee De nada Kenisa! I hope this suggestions help you! I've left a comment also in your QR CODE solution =) Keep it up

  0