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 using HTML and CSS

P
Danny Seo 40

@kisu-seo

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 had the opportunity to use a Figma design file for the first time, and I’m satisfied that I was able to implement a more accurate design.

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

When comparing the image for the mobile view with the desktop view, I noticed that the sides of the image in the mobile view appeared slightly cropped. I wanted to replicate this effect by cropping the sides of the image on mobile, but I couldn't find a way to do it, so I ended up using the same image without cropping.

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

I would like to learn how to create the effect of images being cropped in a responsive website.

Community feedback

Halima584 40

@Halima584

Posted

I really admire the code in general especially the structure of your css, I just realized I've not really gone far in my css😪. Keep up the amazing work!. Also, I would recommend using semantic html, something like header, main, footer, section and others

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