Skip to content
Submitted almost 2 years ago

Order summary [Flexbox/CSS Grid]

accessibility
c4dr-me•150
@c4dr-me
A solution to the Order summary component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

I used both CSS Grid and Flexbox in this one. I would like to learn some new properties and techniques/methods which will be helpful. I would love your feedback and try to implement them right on.

Code

Please log in to post a comment

Log in

Community feedback

  • P
    Alexandra•580
    @Alexandra2888

    Hi! Congrats on finishing challenge! Your solution is very close to the design! Here are a few things I think you can improve:

    • more semantic HTML instead of divs,
    • a figure tag to wrap img for screen readers,
    • when user goes nowhere when clicking you can use button instead of a tag,
    • implement BEM naming convention in CSS, it will help you in bigger projects for cleaner code & improving readability, especially when you will work with SCSS and nesting. Happy coding!

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