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

Order summary card using basic HTML CSS

alt_plusF4 120

@alt-plusF4

Desktop design screenshot for the Order summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Feedbacks, please!

Community feedback

P

@Miculino

Posted

Hey @alt-plusF4

Congrats on completing the challenge. It looks really nice!

Here are my suggestions based on your final solution:

  • Consider changing the box shadow of the "Proceed to Payment" button - refer to the original design

  • Add box- shadow for the card component - refer to original design

  • I don't think there's any utily for the transform: scale(0.94) property there

  • You can vertically center the card by adding min-height: 100vh on the body element and then using flex display properties align-items: center

  • Try removing vertical scrollbar. You can do that by absolute positioning the .attribution element

Marked as helpful

0

alt_plusF4 120

@alt-plusF4

Posted

@Remus432 Thank you, man!

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