Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

[Challenge #3] Result Summary

Desktop design screenshot for the Results summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


I redid this project from scratch because I now have more experience but I can't figure out why the container is stretched so much. Could someone explain to me why the height of the container stretches so much? The advice I got from the community helped me and any other advice is welcome.

Rehíce este proyecto desde cero debido a que ahora tengo mas experiencia aunque no logre entender porque se estira tanto el contenedor. Los consejos que me dejo la comunidad me ayudaron y cualquier otro consejo es bien recibido.

Community feedback

@Blackpachamame

Posted

¡Buen trabajo Gastón! por lo que estoy viendo el contenedor se estira porque le estas aplicando un height: 70vh; tanto a tu main como a ambos section. Eso genera que se estiren para cumplir con dicha propiedad.

Por otro lado, te recomiendo que agregues un breakpoint cuando veas que en determinado ancho se "rompa" el diseño. Por ejemplo, en este caso, con un ancho de 500px el contenido ya empieza a quedar muy apretado, entonces, en lugar de hacer el media query para un máximo de 375px podes hacerlo para 500px directamente.

Finalmente, te recomiendo que para tus próximos desafíos veas la posibilidad de usar variables, aunque sea solamente para los colores que te dan en la guía de estilos.

¡Saludos!

Marked as helpful

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord