NFT value page using simple CSS

Community feedback

• 

  Aakash Verma•6,710

  @skyv26Posted almost 3 years ago

  Hi! Yuval, I just checked your design and also saw your design responsiveness and you did it good. But I noticed some issues.

  1. Your text 3 days left and 0.041ETH is not aligned properly with respective icons and I found cause of this, I would suggest you to use flexbox for your .nft-time and .nft-value div. You can replace your both code with below one.

  .nft-value {
      display: flex;
      align-items: center;
      gap: 5px;
      color: hsl(178, 100%, 50%);
  }
  

  .nft-time {
      display: flex;
      gap: 5px;
      align-items: center;
      color: hsl(215, 51%, 70%);
  }
  

  .nft-data {
      margin-left: 7%;
      margin-right: 7%;
      margin-top: 7%;
      display: flex;
      justify-content: space-between;
  }
  

  It will make your card perfect.

  2. Just wrap your .area div and .attribution div with <main></main> tag and it will resolve your accessibility issues.

  Overall Nice work and I hope you understand above issues and soon solve it.

  Good Luck

  Marked as helpful

  1

  ---

  

  Yuval Carmel•80

  @hoomi88Posted almost 3 years ago

  @skyv26 Thanks, works perfectly!

  1
• 

  Anosha Ahmed•9,300

  @anoshaahmedPosted almost 3 years ago

  To avoid accessibility issues in the future:

  • wrap everything in your body in <main>
  • have at least one h1 in your code

  Good job! :)

  1