Skip to content
Submitted 11 months ago

Stats-preview-component Project

Zuka•30
@Zukamimotu147
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Stats preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

This is my 2nd Challenge and I use some new CSS properties. I still don't know how to properly use pseudo classes so I'm trying to learn it at the moment. Also, CSS units.

If you have any suggestions on how to improve my code. Please leave a feedback. Thank you.

Community feedback

  • Matias Ludueña•1,990
    @matiasluduena23Posted 11 months ago

    Hi ZUKA’S!!! Congratulations you finished the challenge!!! Just one recommendation that might help you.

    • Tried to avoid position absolute to center big elements. With position absolute the element is remove from the normal document flow. Instead you can use flexbox or grid.

    with Flex

    .element {
display: flex;
justify-content: center
align-items: center;
}

    with Grid

    .element {
display: grid;
align-content: center;
}

    In both case if you don't have an height you need to set one. You can use min-height: 100vh

    Hope this help you!

    Good code!

    Matias

    0

Please log in to post a comment

Log in with GitHub

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