Skip to content
Submitted about 2 months ago

Responsive Blog Preview Card

P
Heath Babb•60
@hbabb
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?

Being able to figure out the basics of figma and how to "translate" the figma design into HTML and CSS elements.

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

I found a few issues understanding some of the thing in the figma design, like when it says the padding is 24hug. Luckily, a little google and Ai provided the answer and I was able to write the correct CSS code for this.

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

I think I could do more with adding media queries to help the responsiveness be smoother.

Code
Loading...

Please log in to post a comment

Log in

Community feedback

  • Paulo Vitor Ferreira Gonçalves Pivotto•40
    @high-rolls

    Hey there!

    You did a very good job on the card's positioning, sizing and shadows, as well as internal spacing and alignment. The only part that deviates from the design are the font sizes. Most of the text in your card has a smaller font size than that of the design, except for the author's name, which is larger.

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