Design comparison
Solution retrospective
I'm proud of this project. Today, I learn the new tools of css which are "display" ; "cursor" and "hover"
What challenges did you encounter, and how did you overcome them?My mainly challenge was the useful of "hover"
Community feedback
- @krushnasinnarkarPosted 4 months ago
Hi @t3m4g,
Congratulations on successfully completing the challenge!
I have suggestions regarding your code that I believe will be of great interest to you.
I observed that you use the
.center
class to center the card, but it's not the most efficient way and doesn't center the card properly. Instead, you can add the following CSS to thebody
to center the card perfectly:body { display: flex; height: 100vh; justify-content: center; align-items: center; }
Also, instead of using margins to align elements inside
.card
, you can make.card
a flex container and use flex properties to design it:.card { display: flex; flex-direction: column; justify-content: space-between; /* or any other property to suit your design */ align-items: center; /* or any other property to suit your design */ }
I hope you find this helpful, and I would greatly appreciate it if you could mark my comment as helpful if it was.
Feel free to reach out if you have more questions or need further assistance.
Happy coding!
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