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

Chris 30

@ks-web-workbench

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?

I used custom properties so code is more consistent (I think).

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

I’m not doing too well with handling images in css.

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

The main image in design preview is a bit higher on mobile layout than in my solution. It's cropped on the sides, so aspect ratio is different. Is there any way to achieve the same effect without cropping source image in e.g. Photoshop? Another thing - I'm not sure if I used BEM metodology right (particularly card__author section). And one more thing - I didn't nest anything in css because I read somewhere that this makes the code easier to read. Is that true? I love nesting and I'm a little disappointed ;)

Community feedback

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