Design comparison
Solution retrospective
🔻build with:
- HTML5
- CSS
- Vanilla JS
Community feedback
- @correlucasPosted about 2 years ago
👾Hello Moeka, congratulations on your new solution!
I’ve some suggestions for you:
To improve the card overall responsibility, you can start to add
flex-wrap
inside the class that manages the section for therating numbers button
and makes the adjust to fit in different rows while the container scales down, not that without this property the container doesn't shrink. Here's the code applying these changes:.ratingbtn-wrapper { display: flex; margin: 1.5rem 0; justify-content: space-between; flex-wrap: wrap; }
✌️ I hope this helps you and happy coding!
Marked as helpful1 - @ProgrammerOfDeathPosted about 2 years ago
Hey, nice work!
I would suggest to remove the second main tag and move the content of the both cards into a more reusable card component, cause the two cards share same styles and so on.
So there wouldn't be the sematic html error.
Happy coding!
Marked as helpful0
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