Submitted about 2 months ago

Responsive Blog Preview Card Using A Little CSS Grid and Flexbox

javontrlroberts• 20

@javontrlroberts

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

Blog preview card

HTML
CSS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

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

I am proud of the fact that I was able to apply box-shadow to style the card. I had not used this property previously and I'm happy with the results.

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

Learning how to apply the box-shadow property properly.

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

None thus far but I could always use advice when it comes to making my page(es) responsive, whether naturally or via media query.

Community feedback

Dylan de Bruijn• 3,190

@DylandeBruijn

Posted about 2 months ago

@javontrlroberts

Hiya! 👋

Congratulations on your solution, it looks very close to the design! I can tell you put a lot of effort into it.

Things I like about your solution 🎉

Use of semantic HTML elements
Clear descriptive CSS classes
Use of CSS custom properties

Things you could improve ✍️

Try naming your CSS classes using lowercase and dashes.

I hope you find my feedback helpful! 🌟

Let me know if you have more questions and I'll do my best to answer them. 🙋‍♂️

Happy coding! 😎

🔅 Yuliya 🐈• 240

@O-Julia-O

Posted about 2 months ago

Great job! But forgot about the border around the whole card. :)

Please log in to post a comment

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