Responsive page with HTML and CSS with active hover effects

Hello there! 👋 Congrats! on completing this project

First, you need to solve your accessibility error. Here's how:

• The <h1> through <h6> element tags must be in a sequentially-descending order for headings to be in a correct logical order.

I have some other suggestions!

• Width doesn't need in the body. And I think you miss to add background size, repeat & color. Please add these to fix them. background-color: hsl(225, 100%, 94%); background-repeat: no-repeat; background-size: contain;
• The size of the card is less. But you can use this hack, just adjust the screen size to 75-80% this will make your screen size 1440px, which is needed to build the desktop version.

You can also see my solution for a better understanding of background & size.

Otherwise! You did a great job 👌

Happy Coding! 😊

There is no need to give the body a width value, give it a background-color of pale-blue, background-repeat of no-repeat and background-size of contain.

For a responsive content , there is no need to give the main a height value replace the width with max-width and increase it value for it to be equivalent to the width of the design. max-width:27rem/em which is 432px.

Hope am helpful.

Well done for completing this challenge. HAPPY CODING