Profile card component

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  👾Hello Julián, Congratulations on completing this challenge!

  Great solution and great start! By what I saw you’re on the right track. I’ve few suggestions to you that you can consider to add to your code:

  Your solution its already good, 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-container {
      background-color: white;
      border-top: 1px solid var(--dark-gray);
      display: flex;
      justify-content: space-around;
      align-items: center;
      height: 90px;
      flex-direction: column;
  }
  }
  

  ✌️ I hope this helps you and happy coding!

  Marked as helpful

  0

  ---

  

  Julián Andrés Montes García•150

  @JuliMontesPosted about 2 years ago

  @correlucas Thank you very much, I will review your proposal to improve my code.

  1

  

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  @JuliMontes You're welcome Julian!

  0
• 

  Md5 dalton•1,430

  @md5daltonPosted about 2 years ago

  Saludos Julián 👋

  Para arreglar algunos problemas de accesibilidad, te sugiero que reemplazes div.card-container con una etiqueta de main. Además, con fin de poner todo en contenido en el centro de la página, puedes usar flex-box así:

  body {
     min-height: 100vh;
     display: flex;
     align-items: center;
     justify-content: center;
  }
  

  Y después quitarle los márgenes a .card-container.

  Muy buen trabajo con la solución.👌

  Marked as helpful

  0

  ---

  

  Julián Andrés Montes García•150

  @JuliMontesPosted about 2 years ago

  @md5dalton Muchas gracias, voy a revisar tu propuesta

  1