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

@YazanJbara

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?

maybe the 100dvh on the body trick i will try to explore it more later

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

centering the card vertically , I knew it can be done with flexbox and grid but i tried for so long to do it without even thinking about felx or grid or even absolute positioning until a true legend on discord told me to to put 100dvh at the body i don't know what is it but i will explore it and yeah i had to put flexbox .

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

  • dealing with images in css for me was so hard and so weird i don't even know what max-width:100% thing do but i will search more on it
  • Controlling the size of the image was hard
  • Positioning of the card was a bit of headache
  • Need more general rules or a way of thinking that makes css designing less complex for me

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