Skip to content
Submitted 6 months ago

Blog Preview Card

fvdumah•100
@fvdumah
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?

Proud that I've finished the challenge.

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

I struggled with the the background color for the span learning. It's a flex item so it took the entire block when I only wanted it to take the text content. I tried adding a display: inline to the span but still the same.

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

Would like to know how to approach making flex items take only the width of the element rather than being a block element.

Community feedback

  • Alex•3,130
    @Alex-Archer-IPosted 6 months ago

    Hi again! The spirits of random wants me to review your code again =)

    I have to say - you are writing neat readme page. That's what I just can't force myself to do =) Also interesting idea to create shadow via filter.

    You find very creative solution for span's width! I can tell you about another one. Inline elements inside flexes take over all the width (for flex columns) or height (for flex rows) of their parent element until it has not aligh-items property. In your case you could add this for ".hero" element.

    So that it. By the way, why did you put hover effect in the media query? Cos they won't see it on the phones?

    1
    fvdumah•100
    @fvdumahPosted 6 months ago

    Hi @Alex-Archer-I

    Thanks, the readme was all from the template. I'll try align items next time, I legit spent so long on trying to fix it lol. No particular reason for putting the hover in media query, I just forgot it and put it at the end of my code :D

    1
    Alex•3,130
    @Alex-Archer-IPosted 6 months ago

    @fvdumah Oh, I see. It's just when I see something unusual I always wondering - maybe it's some kind of a new technique =)

    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