Skip to content
Submitted over 1 year ago

Order summary component

JhayJahswill•50
@JhayJahswiil
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Order summary component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Community feedback

  • Akhil-Nagpal•180
    @Akhil-NagpalPosted over 1 year ago

    Hi Jhay! 👋 Congratulations on completing this project! 🎉

    To fix all the accessibility errors, you need to do these things:

    • You must follow a basic web page structure. You used the <main> tag under the <div>. Use <main> only once per page, and put it directly inside <body>. Ideally, this shouldn't be nested within other elements. Read this for a better understanding👉 Document and website structure

    • This structure also applies to headings. The <h1> to <h6> element tags must be in descending order(as per size). Read more 👉 The HTML Section Heading elements

    Other Suggestions 📖

    • Box shadow is a bit high, put 0px for offset x & spread radius set to negative. This will create a very similar effect.
    • To achieve the desired size of the card, I have a trick, slightly adjust the screen size to 75-80%, which will make your screen 1440px.
    • Always read README & Style Guide pages. These pages will help you to understand what to do.

    I hope this will help you. 😊

    Otherwise! You did a great job! 👌 Happy Coding!

    0

Please log in to post a comment

Log in with GitHub

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