Looking to hire developers?
This took me a while and had to get a little help but any feed back would be great. Thanks.
@denielden
Posted
Hi David, I took some time to look at your solution and you did a great job!
Also I have some tips for improving your code:
border-radius from .container class at 1remmargin from container class because with flex they are superfluouspx try to use relative units of measurement -> read hereOverall you did well :)
Hope this help and happy coding!
Marked as helpful
@NaveenGumaste
Posted
Hello David Yu ! Congo 👏 on completing this challenge
Let's look at some of your issues, shall we:
Always use the "alt attribute" and write what img is , and if the img is for decorative then leave it empty but always add it with alt.
Warp your card content around the main tag Ex: 👇
<body>
<main class="container">
*all you content here*
</main>
</body>
border-radius is more reduce it a bithappy Coding😀
Marked as helpful
@codezeloss
Posted
Great work David! Even report issues keep going, by practicing a lot everything will be fine in the future (;. Trick: If you want to center your solution in the design comparison, you can add: display:flex, justify-content: center, align-items: center; height: 100vh. to your code, more specifically to the main container class. Good luck!!!
Marked as helpful
@Li-Bee
Posted
Looks very good 😁 - well done on the hover and icon animation on the picture took me ages to do that!
Few comments for your consideration - most are minor points.
Try and center the card component. Add the following to <body> = height: 100vh
Increase font-weight on 0.041 ETH
The 'font-color' on 3 days left should be the same as the <p> text.
Try and make the avatar picture a bit smaller, it is a bit big
Maybe reduce the shadow color on box-shadow a little bit too dark looks like a line, perhaps change the alpha value to 0.3.
You also have a few accessibility and html issues to sort out. Broadly:
For your <img>add alternative text which describes what the picture is (e.g. alt="picture of glass cube"). (This will also clear the html issues)
Add <main></main> to you body which surround the card div. This will clear the landmark issue.
Change the <h2> heading to <h1> that will clear the level-one heading issue. Need at least one <h1> on page.
Marked as helpful
@boostbm
Posted
@Li-Bee Thank you so much !! I will fix these once I get back home from work! Appreciate the help! Have a great day!
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
