Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Blog Preview Card

P
fvdumah 50

@fvdumah

Desktop design screenshot for the Blog preview card coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

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-I

Posted

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

P
fvdumah 50

@fvdumah

Posted

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-I

Posted

@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
Discord logo

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