Design comparison
Solution retrospective
I am more comfortable with my workflow this time, compared to the previous two challenges. I would like to implement the best CSS practices for the next project. I am confident with my HTML structure, but maybe I have some blind spots. I am open to feedback.
What challenges did you encounter, and how did you overcome them?I struggled a bit in showing the anchor tags as buttons, I am not sure that I've done the best approach. The list element positions were slightly off to the right, a quick search helped me override that behavior.
What specific areas of your project would you like help with?The mobile design doesn't look exactly like my final project. I have too wide horizontal gaps compared to what's shown in the design. Some help with this will be very much appreciated.
Community feedback
- @VitorEmanoelNogueiraPosted 4 months ago
Hello, Purnama S Rahayu, great job, the design is great!
I have some tips that I hope help you:
- For displaying the anchor tags as buttons, what would get them to look more similar to those of the original design is adjusting the height of them so they look bigger. On my project I used 45px of height with 13px of padding-top to adjust the content of the button;
- Adjust the margin between the name and the location. I think just 10px between these two would get the design closer to the original;
- If you want to get it even closer to the original, you can try to resize the image to look a little smaller;
- To get the mobile design closer too, you can try reducing the padding a little (30px to 25px) or/and increasing the cointeiner width a little.
Overall, it's a great design! Keep improving!
Marked as helpful0 - @irfanwijayaPosted 4 months ago
i thinks it's perferct
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