order-summary-component

Hey @payalpagaria, some suggestions to improve you code:

• text-align should never be in the Body Element. Instead it should be in the card container.

• Add background-size: contain to the Body Element to fix the background image.

• Increase the size of the component to better match the FEM example.

• The “Illustration” and Music Icon serves no other purpose than to be decorative; It adds no value. The Alt Tag should left blank and have an aria-hidden=“true” to hides it from assistive technology.

• Delete all the br you added. They are not needed.

• Your content is not fully responsive. Here is a link to Google Developer’s site that will teach you how make it 100% responsive:

https://web.dev/learn/design/

Happy Coding! 👻🎃

Hey what's up buddy your looks great but I think it will be look great perfect if you add padding bottom maybe 8px to your cc container or you can increase the height because the last button is also at edge of your container.

cc{ height:520px; width: 350px; background-color: hsl(225, 100%, 98%); border-radius: 10px ; }

Hi payalpagaria, how are you?

I really liked the result of your project, but I have some tips that I think you will enjoy:

• To improve the accessibility of the project you could have put an h1. Every page must contain a level 1 header, for people who use screen readers, identity what the main title is.
• every Html document must contain the main tag, so we can identify the main content, to fix this, wrap all the content with the main tag.

The rest is great!

I hope it helps... 👍