Design comparison
SolutionDesign
Community feedback
- @Code-BeakerPosted 6 months ago
Hi there, congratulations on completing this challenge. You've done a great work! 🎉
I would like to put forward some of my suggestions regarding your solution that might help you improve it.
- use proper tags for the elements.
for example, the "Change" is a link. You have used a
<p>
tag in your HTML to create that element. But, as it is a link, it should be an anchor tag.
<a href="#" class="change">Change</a>
this will also help you minimise the HTML you're writing. Instead of a
p
wrapped in adiv
, simply use ana
tag.Do the same for the "Cancel Order". It is also a link.
- instead of using
body { height: 100vh; }
use:
body { min-height: 100vh; }
- use
rem
instead ofpx
. While usingpx
is certainly not wrong,rem
values are better when building responsive layouts and is easier to handle. If you wish to learn more about this topic, refer to this article
Overall, your solution looks impressive.
Hope this helps you learn something new! 😃
Marked as helpful0@vanimittal1304Posted 6 months ago@Code-Beaker Okay thankyou so much for feedback, this will help me in brushing up my skills.
1 - use proper tags for the elements.
for example, the "Change" is a link. You have used a
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