Design comparison
Solution retrospective
Is my code understandable?
Did I use the semantic HTML tags correctly, should I add more or less?
In what areas of my code can I improve on?
All feedback is greatly appreciate. It helps me to improve as a frontend developer. Thanks!
Community feedback
- @IkuewumiPosted over 1 year ago
Hi Karen 👋. This solution is awesome👌. The JS logic is elegant. About semantics, I think you got it absolutely spot on. But I do have a few minor suggestions:
On the 🎲 button, it looks like an oval, probably because of the approach you used to form the "circle". I would suggest making the container/button a fixed width and height, greater than the icon, and then center the icon with, like, flex or something. This should lead to a perfect 🔵 at all sizes.
I saw that you defined a fixed width on the card. In this case is works fine with no overflow, but I'll suggest checking out this technique for making more fluid layouts with the css
min
function;main { width: min(350px, 90vw); }
I hope this helps. Again, this solution is really cool. If you have any questions, don't hesitate to ask. Keep coding👍,
Ayobami
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