Submitted about 1 year ago

Order Summary Components

Adonai Jonathan• 290

@ajadonai

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

Order summary component

HTML
CSS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

Here is my solution to the "Order Summary Challenge".

I didnt encoounter any real issue while working on this project but i somehow feel i could have made it better. All in all, i am proud of my work.

I added a few other things to the page, like an order, cancel confirmation page and a little piece of javascript just for feel of functionality

I am opened to suggestions on how to better my code <3

Community feedback

hitmorecode• 6,230

@hitmorecode

Posted about 1 year ago

Congratulations well done. Just a few things

You forgot to add the background
The image in the annual plan area is not round
The card is not in the center of the page. You can fix this by adding a few lines of CSS in the body

body {
background-color: hsl(225, 100%, 94%);
min-height: 100vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}

Please log in to post a comment

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