Design comparison
SolutionDesign
Solution retrospective
What are you most proud of, and what would you do differently next time?
I realize that I'm getting better at running and writing code in terms of speed
What challenges did you encounter, and how did you overcome them?The biggest challenge was finishing the project by perfecting the details
What specific areas of your project would you like help with?I would like to improve on the latest revisions of the project, to understand if my work is valid or not
Community feedback
- @ArryBlackPosted 8 months ago
Layout looks great.
- One issue I notice is that the card starts to overflow on smaller screens (starting around 396px and below). Instead of setting the width of the card a fixed rem value, you should opt for a percentage value, setting in max and min-width values based on your preference. That is the only thing you need to change to make this layout responsive, no media queries necessary. For reference, I set a width of 30% for my card. I set min-width:256px (80% of 320px), which is the smallest screen size to optimize for. You can set the max-width based on your preference.
- The fonts on your buttons don't match with the given design, although they look good.
- You can make your markup more semantic, maybe add the card into a main tag.
Btw, I solved the same challenge recently, any feedback on it will be appreciated, thank you!
Marked as helpful1@LorenzoSerra1Posted 8 months agoYou're right, thanks for the tip, it helped. I really appreciated mate @ArryBlack
1 - @digigrrl525Posted 8 months ago
Good job. I agree that it is a nice feeling when you can speed up the process.
2@LorenzoSerra1Posted 8 months agoYess, it makes me feel more confident @digigrrl525
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