Results summary component

Hello @good-mistake!

Your solution looks great!

I have a couple of suggestions for improvement:

• First: In order to make your HTML code more semantic, don't skip heading levels - start with <h1>, then use <h2>, and so on.. Unlike what most people think, it's not just about the size and weight of the text.

📌 The <h1> to <h6> tags are used to define HTML headings.

📌 <h1> defines the most important heading.

📌 <h6> defines the least important heading.

📌 Only use one <h1> per page - this should represent the main heading/title for the whole page.

• Second: Still about semantic HTML, use <main> to wrap the main content instead of <div>.

All these tag changes may have little or no visual impact but they make your HTML code more semantic and improve SEO optimization as well as the accessibility of your project.

I hope it helps!

Other than that, great job!

Hello there 👋. Good job on completing the challenge !

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

• Even though the number '76' is the largest text in the component, it doesn't necessarily mean it should be an <h1>. Headings have a hierarchy and are meant to indicate the structure and importance of content .In your solution, one of the important header elements is a number that does not describe the component itself.

• Use semantic elements such as <main> and <footer> to improve accessibility and organization of your page.

• If the image is purely decorative, meaning it's an icon that doesn't add any essential information to the page, you can leave its alt attribute empty so that screen readers can ignore the image.

• To center the component in the page, you should use Flexbox or Grid layout. You can read more about centering in CSS here 📘.

I hope you find it useful! 😄 Above all, the solution you submitted is great!

Happy coding!