Skip to content
Submitted 2 months ago

Blog preview card

Csaba Hell•140
@hellcsaba
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Blog preview card
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

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

I'm happy that I used semantic HTML5 in my solution whether I'm not a 100% sure that I used it at the best. Moreover, I learnt that the max-width css property can have fit-content value which can be useful for my future projects. Maybe next time it would be nice to try out the mobile design first approach.

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

I didn't know how to make the learning category tag's background properly. After research on the internet I found the fit-content value.

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

I used semantic HTML5 markup, however I'm not sure in my solution. Would it be better to include the blog-image in the content section?

Community feedback

  • ayx•60
    @ayx234Posted about 2 months ago

    Hello,

    Your code is well structured, and I only have minor notes:

    • Think of the design components in terms of their placements. This article card will be part of a page which will already have an <h1>. <h2> is better as a header for this card.
    • You included an overflow: hidden; for the body, but why would you want to hide a part of major page section?
    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