Used basic css and html. Mixed flexbox with grid layouts
Design comparison
Solution retrospective
-I feel like I can clean my code up a bit more. For example the fractions of /100, I used seperate selectors for to change the colors. Is there a more efficient way of say changing a few words colors within a <p> element? Or do I just have to use a span and select them? -Also, I have no idea how to format this for mobile yet.
Community feedback
- @Aimal-125Posted over 1 year ago
In your CSS code, increase the height of body element to 120 or 150vh by using media query with
max-height: 400px;So that your card look good on small heighted screens.1 - @Raheem-kingPosted over 1 year ago
your design looks good, while designing mine i grouped the text and the fraction(81/100) in a seperate paragraph making the colouring of the text much easier by giving them classes. just like u said span also works, the goal is to replicate the design so whatever way you use and u get the result, i think it's fine. regarding the mobile version try using media queries to make ur mobile design responsive. Hope this was helful, and i wish you luck in your learning journey.
1
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