Design comparison
SolutionDesign
Community feedback
- @RioCantrePosted over 2 years ago
Hello there! Good job in this challenge. Viewing the solution, I think you should consider the following as well…
- Instead of
div
, alternatively wrap the whole content withmain
tag . Use semantic tags, for HTML structures, refer it with this one Semantics - Include
alt
with description in image tags. Like this line<img src="images/icon-view.svg" class="eye">
- Clean the whitespaces in the code
- Add the hover state of the
h2
and.creator pre
rule sets - Refactor this part and evaluate the details into...
From: <div class="symbols"> <div> <img src="images/icon-ethereum.svg" id="eth"> <small>0.041 ETH</small> </div> <span></span> <div> <img src="images/icon-clock.svg" id="clock"> <small>3 days left</small> </div> </div> Into: <div class="symbols"> <div class="sample name here"> <img src="images/icon-ethereum.svg" id="eth"> <small>0.041 ETH</small> </div> <div class="sample name here"> <img src="images/icon-clock.svg" id="clock"> <small>3 days left</small> </div> </div> CSS: .sample { display: flex; align-items: center; }
- Remove
margin-bottom: 10px;
in.symbols small
rule set and addpadding: 0 0.2rem;
Above all, Well done! Keep it going!
Marked as helpful0@MO-KA19Posted over 2 years ago@RioCantre Thank you very much for the feedback, I am still pretty new to these stuff and frontend mentor challenges so I just look at the picture and try to make it with my mind, These feedbacks help me so much to improve and I will try your notes in my next challenges. Thank you again 3>
0 - Instead of
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