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

Responsive Score Layout using html and css

@SebastianBadillo

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


The main difficulty is making the layout, as it is supposed to go.

I am not very sure about my grid and flex syntax, and cod efficiency.

how can I simplify my code?

Community feedback

@CephalonShohan

Posted

Hello SEBASTIAN, very good job with your code. As a beginner, I am also learning.

you can use the gap property in the result section rather than trying to use fr to align them and just be done with it.

you can use flex or grid to align the items of the summary section. otherwise, on the large screen, the items in the summary section are a bit off-center. these are my only two suggestions. also, you can set a max width to the result and summary or their parents so that it doesn't grow very much. Everything looks nice. good job.

Marked as helpful

0

@SebastianBadillo

Posted

@CephalonShohan thanks for your feedback, I am going to try it. :)

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