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
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


I found the hardest part of the project was hosting on GitHub pages.

Community feedback

Daniel 🛸 44,230

@danielmrz-dev

Posted

Hello Edgar!

Your project looks great!

I noticed that you used position to place the card in the middle of the page. Here's a very efficient way to center the card:

  • Apply this to the body (in order to work properly, don't use position or margins):
body {
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
  • Also, the card's box-shadow has no spread radius in this case. You can just do it like this:
box-shadow: 20px 20px 0px black;

I hope it helps!

Other than that, great job!

Marked as helpful

0
Anna 60

@AMinakova

Posted

There is a readme of how to publish solutions, you can find a link in readme. Probably that could help

Marked as helpful

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