Skip to content
Submitted about 2 months ago

Blog Card - CSS Grid | Flexbox | Custom Properties | BEM

bem
JakeH42•30
@JakeH42
A solution to the Blog preview card challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

What are you most proud of, and what would you do differently next time?

I think I am getting better at correct syntax and scalable CSS.

I would appreciate a second set of eyes though!

What challenges did you encounter, and how did you overcome them?

I striuggle to find out exactly what styles are applied in the figma file so mainly use the eye test. Or are we supposed to be pixel perfect?

What specific areas of your project would you like help with?

Any help and/or feedback is much appreciated!

Code

Please log in to post a comment

Log in

Community feedback

  • P
    Danijel•200
    @danijel374

    Hi there 👋

    I suggest getting used to working with box-sizing: border-box, as it's the standard and generally makes layout work easier. You can read more about it here: Josh Comeau – One Box-Sizing Model.

    Also, consider changing the card's max-width from 375px to max-width: 384px, as that matches the Figma design more accurately. Regenerating the screenshot afterward will show how it all aligns more closely with the original layout.

    Good job — keep it up! 🚀

    Marked as helpful

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