Skip to content
Submitted about 2 years ago

Article Preview card

Mohit Mummon•530
@Mohit-k-Mummon
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Article preview component
  • HTML
  • CSS
  • JS
1newbie

Design comparison

SolutionDesign

Solution retrospective

I had a little trouble with the image sizing here. I couldn't get it to match up to the design as I would have liked. If you have any advice for me that would be appreciated

Community feedback

  • Kawsar Ahmed Fahad•2,660
    @faha1999Posted about 2 years ago

    Hello, Mohit Mummon Congratulations on finishing this project. It's lovely and great on the whole! Just a little tips:

    • add favicon <link rel="icon" type="image/png" sizes="32x32" href="./images/favicon-32x32.png">

    • You might want to use semantic tags like the <main> to wrap your code, instead of div. like

    <main>
<div class="wrapper"></div>
<div class="attribution"></div>
</main>

    This would help improve accessibility.

    • I saw in the .css that sometimes you use px & rem. To optimize your speed when resizing fonts for various displays and devices, substitute rem or em rather than px. These components work better to improve the accessibility of your website. REM applies to all sizes, not just the font size.

    I hope it will work. Happy coding.

    Marked as helpful
    0

Please log in to post a comment

Log in with GitHub

Join 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