Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted almost 4 years ago

Stats Preview Card

Aidan•100
@aidan57
A solution to the Stats preview card component challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


Hey everyone! I had a bit of a hard time trying to get the image to have that color. I wasn't sure how to do a proper overlay, so I ended up putting the color as the background and giving the image an opacity. But the provided color didn't look right, so I improvised with a different color. I also had a hard time trying to get the container centered. I tried positioning it absolute and doing transform translate, but when I did that and inspected the screen, it would show the body is out of view above my screen and that my container was below my body and html. So in turn, I had to mess around with the margin. Please let me know what you guys think and if you have any tips on what I can do better! :)

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on Aidan's solution.

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

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner
  • Use cases

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License