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

Mobile First Results Summary Component

P
Shaun Pour 630

@ShaunPour

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


When it comes to css I'm not the best and this project was done with the intention of improving my design skills. I plan to do more such projects along this trajectory so if you have any constructive criticism about what to change regarding this or ways to approach things differently in the vein of "get better at css and design in general", I would love to hear them. Thanks!

Community feedback

moi21dev 50

@moi21dev

Posted

Hi Shaun,

well done in completing the project!

For future projects I would suggest to :

  • learn CSS Flexbox, here you can find the Modzilla's guide. By visiting the Live site of your project, I saw that at different width of the viewport the content is not displayed as it should. Flexbox is very useful to layout content while taking care of the responsiveness.

  • use the developer tools in Chrome or Firefox, not only they help you analyze the page you're building, but you can even test if the page is responsive or not.

  • in your .css file always add the font you're using, and it's better include the font file in /assets too.

font-family: 'font name', 'back up font name';

Keep up the good work!

1

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