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
Desktop design screenshot for the Order summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

@weldu0

Posted

👋 Hey, @Maame-codes! I like the precise use of the background image.

Remove the margin from .info-card and add flexbox to the body. It should look like this:

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

}

Using margin only centers the element horizontally, while flexbox allows you to center it both horizontally and vertically.

Everything else looks great. Great work! 👏

I hope you find this helpful. 😊

0

@Maame-codes

Posted

thanks a lot! was kind of stuck with that one. This is really helpful@weldu0

0

@weldu0

Posted

You're welcome! I'm glad to hear that it was helpful. @Maame-codes

Marked as helpful

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