Design comparison
Solution retrospective
Hello! The most difficult part for me was the profile image, i am using absolute position and percentages to center the image, is there any better solution for this part of the card?
Thanks!
Community feedback
- @pikapikamartPosted over 3 years ago
Good work on that, your positioning is okay, it is okay to use absolute position but keep in mind that limiting it only on components that have low priority, but since I am used to using flexbox, for me i'll just use flexbox on it. Just giving a padding-top to the container and then aligning them center, the profile image along with the name of the person, then just adding gap on them so that I could avoid absoluting it (absoluting seems is not a word hahah) well that's just one solution to the question, but yours is a solution as well and it really works well^
0@SrCienpiesPosted over 3 years ago@pikamart Thank you so much! I would not have come up with this solution. I always have some issues at the moment to put an image above another one, i definitely will practice your solution in future challenges.
0@pikapikamartPosted over 3 years ago@SrCienpies Your welcome on that and if you need help, just drop your question^
0 - @DrallasPosted over 3 years ago
Hello Diego
Nice card implementation!
I also used absolute to place the image. You could try with margin left & top.. I Just opened my project for this and i get the picture in the center like that too. Perhaps you could give it a try and see if it works for you.
0@SrCienpiesPosted over 3 years ago@Drallas Thanks Drallas! I will try that solution and see which one fixed better for me.
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