Design comparison
Solution retrospective
I would appreciate any feedback.
Community feedback
- @GitHub-dev12345Posted almost 3 years ago
Congratulation to complete the challenge ππborde My Small Suggestion : bro give the border-radius in your card design CSS Code: like:-
- border-radius: 12px;
Keep it up bro nice Work β€οΈπ
Marked as helpful0 - @PhoenixDev22Posted almost 3 years ago
Hello @luissitoe,
I have some suggestions regarding your solution:
-
For any decorative images, each img tag should have empty
alt=""
andaria-hidden="true"
attributes to make all web assistive technologies such as screen reader ignore those images in(icon-view, icon-ethereum, icon-clock
). -
the avatar 's alt shouldn't be
avatar
, you can set toJules Wyvern
. -
the link should be wrapping the original image and either have
Sr-only
text, anaria-label
oralt
text that says where that link takes you. -
the
icon-view
doesn't really need to be in the html, you could do it with css. If you want it to stay in html it needs to be aria-hidden or role presentation with empty alt. Also ,you don't need an extra div for the overlay , you may use pseudo-elements. -
You can use an unordered list
<ul>
to wrapclass="card__wrp"
and in each<li>
, there would be<img >
and<p>
(to wrap the text ). Then you can use flexbox properties to align them centrally. -
Alt text for the profile image shouldn't be
profile.
Read more how to write an alt text -
I recommend to use
em
andrem
units .Bothem
andrem
are flexible, Usingpx
won't allow the user to control the font size based on their needs. -
Never use
px
for font size.
Overall, your solution is good, Hopefully this feedback helps.
Marked as helpful0 -
- @SamarthMaliPosted almost 3 years ago
Nicely Done π€
Marked as helpful0 - @NaveenGumastePosted almost 3 years ago
hay! Luis Sitoe Good work Keep it up
Marked as helpful0
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