Design comparison
Solution retrospective
For the rating icon, which is best to use: flexbox or grid? Can you explain the reason why you think about that?
I use flexbox on rating icons, but I feel that there has a better way to center the row of icons. I have to use margin to make it work. Any suggestion about this one?
Community feedback
- @DavidMorgadePosted over 2 years ago
Hello man, first off all, good job completing the challenge!.
In your rating icons you are using flex-box in the parent element, by default they will go flex-direction: row, wich is ok, but to adjust them horizontally, you need to use justify-content in the parent element. This by default is flex-start, in this case the one wich fix perfectly is space-between (it fills the box from start to end with all the icons separated with the same distance).
If you want to try this in your own code, remove the margin from your rating-icon class, and add the property justify-content: space-between to your container-rating class (alongside with display: flex).
Hope this help you, and tell me if it gets you to the desired result!
Marked as helpful0@Ed-CodePowerPosted over 2 years ago@DavidMorgade Thanks so much for your advice and it did get the desired result that I looked for.
0
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