Design comparison
Solution retrospective
I did well here? I made it using grid property and it worked very well.
I will be happy if I get more reviews.
Community feedback
- @JohndiddlesPosted over 2 years ago
Hi Mahmoud! I really love your solution. You did really good with this.
I see you gave your grid items some margin to space out the items, it is a better practice to use gap instead of margin just like this;
.container { display: grid; gap: 20px; }
This will evenly space out all the items in the grid by 20px both vertically and horizontally and you won't be needing the margins.
Also you can consider using other size units (such as em) for your texts instead of 'px'. I also see you have the same text color for all your p tags, but I think according to the designs, the colors are meant to be different. The white backgrounds have darker texts while the other ones have much lighter texts.
Overall, you did a solid solid job. Cheers 🍻
Marked as helpful1@elshoraPosted over 2 years ago@Johndiddles cheers mate.
Those are very helpful notes, thank you very much. I work on it.
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