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

mahbt 250

@mahbt

Desktop design screenshot for the Blog preview card coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

jan28x 50

@jan28x

Posted

Your solution is incredibly similar to the design!

Minor changes in the appearance of the site could be:

  • The preview card itself is not really centred in the design, it seems to be more towards the top than the bottom. Using relative units was a good choice, however maybe using % instead of vh units would allow it to be centred more. Using vh units adds a lot of extra space under the credits.
  • Using any of the methods listed here woudl allow you to centre the div, and would reposition the card in the center of the screen even if you made the screen smaller height-wise. Currently your card requires scrolling the page if the height of the site is made smaller.
  • The box-shadow disappears off-screen on a phone, so perhaps adding a bit of padding to the "card" div would ensure the entire thing would show up.
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