Design comparison
SolutionDesign
Solution retrospective
Heyy, first Frontend Mentor challenge over here. Satisfied with the result but I guess there is easier and improved code on the community solutions and I can't wait to see it.
Community feedback
- @JimTK16Posted 12 months ago
Nice first one Maria.
A couple things to consider are:
- Put your .card in the <main> tag so your code look more semantic.
- Avoid setting fixed width for your container, instead of width:300px, you can set max-width: 300px.
- Setting the height of the container in this case is not necessary i think, you can toggle this property in the devtool and see the changes it makes.
- There no changes in layout between mobile and desktop version, and the content can fit in just 1 column, so I think flexbox might be an easier option than grid. Hope it helps!
Jim
Marked as helpful0@mariaigle98Posted 12 months agoHi @JimTK16 thank you so much for your feedback! I'll take it all into account and improve my code.
1 - @ThiagoBRG60Posted 12 months ago
Hey, it looks great for a first challenge, just make sure to match the colors. Always keep learning and improving 😉.
Marked as helpful0@mariaigle98Posted 12 months agoHi @ThiagoBRG60 thank you for your feedback! I definitely need to pay more attention to colors 😅
1
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