NFT preview card component

Community feedback

• 

  JuvoGenesis👾•2,010

  @AkoToSiJeromeEhPosted 6 months ago

  Hey ! great work out there i just notice that you using margin to center horizontally the card component but it doesn't work as i notice , i suggest that you can use display : grid or display : flex with a min-height or height for proper alignment . by adding those css property you properly align the card horizontally . thats all happy coding !

  by adding the display : grid and place-items : center you can achieve to center the card and any future work you create ( you can see the difference when you do zoom-out and zoom-in in your card component )

  body {
    font-family: "Outfit", sans-serif;
    font-size: 18px;
    background-color: var(--main-BG);
    color: var(--White);
    padding: 20px;
    margin: 60px auto;// you can remove this
    display: flex; // add this
    justify-content: center; //add this
    align-items: center; //add this
    min-height: 100dvh; //add this
  }
  

  .conteiner {
    padding: 20px;
    background-color: var(--card-BG);
    border-radius: 20px;
    margin-bottom: 16px;
    max-width: 400px;
    margin: auto;// you can remove this
  }
  

  Marked as helpful

  0

  ---

  

  Andressa Karen•100

  @andressakarenPosted 6 months ago

  Hi @AkoToSiJeromeEh, I hope everything is well with you. I didn't really think of doing it this way, but I can already imagine how it can work and that it's even better. I will make the changes you suggested and study about other units like 'dvh'. Thank you very much for your comment.

  0