Blog preview card with HTML and CSS

Community feedback

• 

  Rabel•190

  @RabelahmedPosted 4 months ago

  display: flex; align-items: center; justify-content: center; min-height:100vh;

  Try this on the parent element of your card component

  Marked as helpful

  1

  ---

  

  Aria Frost•50

  @R3AriaPosted 4 months ago

  @Rabelahmed Thanks for the help, I was missing the min-height as I had no knowledge of it.

  0

  

  Rabel•190

  @RabelahmedPosted 4 months ago

  @R3Aria happy to help

  0
• 

  Lance•1,580

  @IzykGitPosted 4 months ago

  Good work!

  I noticed in your CSS that you are using margin to create space between your elements and the edges of the card. In CSS there is an attribute called padding that will automatically create even spacing between all elements and the edges of the parent container!

  So in your .card class you would want to set the padding to 24px so that way it creates a 24px gap between all the elements and the card itself.

  Keep up the good work!

  Marked as helpful

  0
• 

  Rabel•190

  @RabelahmedPosted 4 months ago

  On the body element for your solution and congrats on completing the challenge

  0