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
Request path contains unescaped characters
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Order summary component using flexbox

@BrandonAOV

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

Sebastian 100

@MecosLB

Posted

Hey Brandon! Nice job, your solution looks pretty cool! 👏

Just a reminder to use the :hover pseudo-class to achieve the active state effects some components as the buttons require on this challenges. 😉

Also, great job using display: flex; flex-direction: column;, but sometime there's no need to use it. E.g: <button> with display: block; can achieve the same positioning you were looking for with the flex-direction: column; 👌

Keep coding 💻

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