Blog Preview Card

Community feedback

• 

  Daniel 🛸•44,310

  @danielmrz-devPosted 11 months ago

  Hello @sandbrock!

  Your project looks great!

  I have a few tips for you to improve it:

  • If you add a box-shadow to your card, it'll look even closer to the original design. Something like this is enough:

  .card {
      box-shadow: 10px 10px 0 black;
  }
  

  • I noticed that you used margins to place your card closer to the middle of the page. You can center an element by adding this to the body:

  body {
      height: 100vh;
      display: flex;
      justify-content: center;
      align-items: center;
  }
  

  By doing that, you won't need margins to move your card.

  • Use semantic tags. Your div.card can be replaced with main.card. The main title could (and should) be a h1 and so on. This can change a few things visually but it makes your HTML code more semantic and improves SEO optimization as well as the accessibility of your project.

  I hope it helps!

  Other than that, you did a great job!

  Marked as helpful

  0