NFT Card with Less CSS

Community feedback

• 

  Salah Najem•350

  @Salah1221Posted over 2 years ago

  Hi Rian, You did a great job in your solution, but I noticed some improvements that can be made:

  1. You can remove the annoying space below the image by adding display: block; to .cypto.
  2. Add white-space: nowrap; to the h2 headings of .time and .price to keep them on the same line.
  3. Add position: absolute; to .attribution to remove it from the document normal flow so it can be positioned easily with respect to the body without interfering with the card.
  4. Center the card in the body using flexbox, before doing that the body should have the full height of the view port (give height: 100vh; to the body).
  5. After centering the card you can remove the margin, margin-top, and margin-bottom properties from the .container div so the card would be perfectly centered. And that's it! Happy coding!

  1

  ---

  

  Rian Julianto•110

  @RianjulianPosted over 2 years ago

  @Salah1221 wow, thank you for the feedback!

  1