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

Responsive stats-preview-card-component using flexbox and css grid

@HafizHamzaRauf

Desktop design screenshot for the Stats preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

Philipp 190

@hermi72

Posted

Hey @HafizHamzaRauf, some suggestions to improve you code:

Your direction is correct. I can see that you've used the majority of the semantic tags that are appropriate for this challenge; the only block you missed was the paragraph that contains the quote text. By using <blockquote> there, you can increase accessibility by telling screen readers that the content inside that paragraph is a quote.

To center you content to your page, add the following to your Body Element:

body { 
min-height: 100vh; 
display: grid; place-content: center; 
}

Happy Coding! 👻🎃

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