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

Results Summary Component

Sumanth Chandanaβ€’ 720

@sumanth-chandana

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


Happy to receive your feedback. I really appreciate any help you can provide.

Community feedback

Gerald LeCourβ€’ 170

@Gerald-LeCour

Posted

Hey there!πŸ‘‹

Here are some things I would change:

  1. I would remove the (margin: 15vh auto;) from your div.container (look at step 3 to see how to center it again)
  2. I would git rid of these styles from the div.summary and put them in your div.container:
border-radius: 20px;
and box-shadow: var(--Dark-gray-blue) 5px 10px 30px 0.1px;)

3.Here is some code that I made to center your div.container:

body {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  min-height: 100vh
}

Hopefully this might have helped you! πŸ‘

0

Sumanth Chandanaβ€’ 720

@sumanth-chandana

Posted

@Gerald-LeCour I really appreciate your feedback!

1
Abdul Khaliq πŸš€β€’ 72,660

@0xabdulkhaliq

Posted

This comment was deleted

0

Sumanth Chandanaβ€’ 720

@sumanth-chandana

Posted

@0xAbdulKhalid Thank you for your feedback. Will be looking into it. And could you tell me why I'm getting a Screenshot in a mobile view rather Desktop view?

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