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

Result Summary Component

@SaeM843

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


Hi there, I’m Sae and this is my solution for this challenge👋

Any feedback on how I can improve code, especially the right summary section, are more than welcome!

Thank you.

Community feedback

Chris 520

@9CB5

Posted

Great solution. There's not much to improve on, but if we're going to nitpick:

  • The "summary" header is in line with the list if you look at the design. Simply adjust your margin on your li to margin: 8px 10px 18px 0px; to get them in line.
  • Avoid using percentages for your border radius, otherwise you get a weird pointy/curvy corner.
  • Increase the border-radius on the button for a more pill shape look.
  • Implement the mobile design.

Hope this helps. Happy coding :)

0

@SaeM843

Posted

Hi @9CB5, Thank you very much for the feedbacks! It is now updated:)

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