Design comparison
SolutionDesign
Solution retrospective
Please guide me through setting the view icon image on the equilibrium image with pseudo elements or any other good way to write this code.
Community feedback
- @denieldenPosted about 2 years ago
Hello Sudharshan, You have done a good work! 😁
Some little tips to improve your code:
- use
main
tag to wrap the card and improve the Accessibility but not as a container of that one element - also you can use
article
tag instead of a simplediv
to the container card for improve the Accessibility - remove all
margin
fromcard
class - use flexbox to the body to center the card. Read here -> best flex guide
- after, add
min-height: 100vh
to body because Flexbox aligns child items to the size of the parent container - Using
<hr>
for the line is not the best way because this tag have a semantic meaning... in this case use div withborder-bottom
because this line is decorative - instead of using
px
use relative units of measurement likerem
-> read here
Keep learning how to code with your amazing solutions to challenges.
Hope this help 😉 and Happy coding!
Marked as helpful0@Sudharshan-24Posted about 2 years ago@denielden Thank you so much for your suggestions Deniel.
1 - use
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