Stats preview card using HTML, Sass and Bootstrap

Community feedback

• 

  J.D. Browne•870

  @PeshwariNaanPosted over 2 years ago

  Nice job Ricardo. One thing that I think will help you is how to make the image responsive. Create a <div> container that will hold your image -

  <div class="image-container"> <img class="image" src="./whatever"> </div> -

  Once you have this add this code to your .image scss code: .image { max-width: 100%; max-height: 100%; object-fit: contain; overflow: hidden; } This will force the image fill the container and change responsively and keep its aspect ratio. I hope this helps.

  Marked as helpful

  0

  ---

  

  Ricardo Fuentes Urbina•370

  @RicardoFuentes437Posted over 2 years ago

  @PeshwariNaan Thank you very much for your feedback, making the image responsive was one of the hardest things for me in this challenge, this is really helpful, thank you again :)

  0
• Account deleted

  Buen trabajo!! 🎉 Tengo algunas sugerencias:

  • div class='image-section' puedes cambiarlo por un figure para que sea más semántico.
  • Tienes h2 pero no unh1. Recuerda todo HTML debe tener un h1, para la accesibilidad.
  • Considero que las estadísticas son una lista desordenada: ul class="stadistics", li class="heading-stats number"

  Puedes visitar mi solución a este challenge 👉 aquí. Espero haberte ayudado, sigue así 💪💪

  Marked as helpful

  0

  ---

  

  Ricardo Fuentes Urbina•370

  @RicardoFuentes437Posted over 2 years ago

  @irismendez Muchas gracias por el feedback :) no conocía el tag figure pero ahora definitivamente lo utilizaré en mis proyectos.

  Saludos.

  0