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-component

Mathias Dell'Osaโ€ข 210

@MathiasDWaterlaw

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


any suggestion is welcomed

Community feedback

@MelvinAguilar

Posted

Hello there ๐Ÿ‘‹. Good job on completing the challenge !

I have other suggestions about your code that might interest you.

  • For icons, you should still use the alt attribute, but it should be empty (alt=""). This indicates to screen readers and other assistive technologies that the icon is decorative and that they should skip over it
  • Consider using a button instead of an anchor tag for the "change" element, as buttons are designed for actions like altering the order's plan. Anchors are typically used for linking In this instance, the action involves altering the order's plan, making a button a more fitting choice.

I hope you find it useful! ๐Ÿ˜„

Happy coding!

0
Daniel ๐Ÿ›ธโ€ข 44,230

@danielmrz-dev

Posted

Hello @MathiasDWaterlaw!

Your project looks great!

I have a few suggestions for you to improve it:

  • If you add height: 100vh; to the body and remove the margins from the div.card, your card will be placed in the middle of the page and also remove the vertical scrollbar.

  • Also, consider replacing the div.card with a main.card. This won't change anything in the design, but your HTML will become more semantic.

Other than those little details, my friend, you did an excelent job!

I hope it helps!

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