Design comparison
Solution retrospective
Open to any ways I could improve!
Community feedback
- @ericsalviPosted almost 2 years ago
Hey @maiaflow,
Great job on another challenge. You are unstoppable!
I am not seeing too much from a design POV except I feel the card can get too long on very wide screen sizes. So I would probably try setting a
max-width
forbody main
on the desktop only. That way when the screen gets really wide, the card doesn't get really wide as well.Also, one thing that I like to do is with the footer section in the card you have a
margin-top
being set to push it down the page a bit. Sometimes what I like to do is set the actualsection
content todisplay: flex
andflex-direction: column
. Then you could change themargin-top
toauto
. What this will do is push the footer to the bottom of that section and so no matter what height the card ever becomes, the footer will always stick to the bottom of the container.You have 3 invalid issues in your HTML. The social sharing icons you have do not have the
alt
attribute. Even if an image doesn't need to have a need for actual alt text, the attribute still needs to be present. Just addalt=""
to your 3 images to fix those issues.The JS looks great and you should be proud of yourself for getting it done. The more of these that you do, the easier it will become. Also, the new word you created called
sharrow
is pretty cool!Let's chat more about vendor prefixes.
Keep up the momentum!
0
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