Design comparison
Solution retrospective
Any feedback is welcome! π
Community feedback
- @correlucasPosted over 2 years ago
πΎHello Greta, congratulations for your solution!
You did a good work with the card, is super flexible and the background is well positioned with the two elipses (this was the hardest part).
There's only one problem with the card in the mobile version, note that when the screen starts to scale down, the card information starts to crop due the
overflow: hidden;
you've added to the .card class making the card stats hidden.To fix this behavior you need to delete the
overflow: hidden;
or add a media query to change the card stats direction vertically.@media (max-width: 320px) { .card-text--data { display: flex; flex-direction: column; }}
Hope it helps, happy coding!
Marked as helpful1@GretaLiPosted over 2 years ago@correlucas Ciao Lucas, thanks for your kind comment!
I totally forgot to check the dimension below 375px, I fix the overflow problem right away. πββοΈ
The two ellipses were really hard, I almost gave them up. I'm glad it turns out well in the end. β¨
0
Please log in to post a comment
Log in with GitHubJoin 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