NFT preview card component, basic css and html

Community feedback

• 

  Mebo David•130

  @meistensPosted over 2 years ago

  Hey there, Not bad with the design, though to be honest, your code was kinda hard to read. Here's some tips though

  body {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    min-height: 100vh;
    background-color: hsl(217, 54%, 11%);
  }
  

  Once you got the body sorted out, apply these to your container and fiddle about with the height and width values as you fit.

  .container{
    background: hsl(216, 50%, 16%);
    width: 15rem;
    height: auto;
    border-radius:1rem  ;
  }
  

  For centering the eye icon and the background color, use the ::before and ::after pseudo elements, should make things easier for you

  1

  ---

  

  Paweł•1,030

  @Pawel-GnatPosted over 2 years ago

  @meistens Wow, your comment really means a lot for me. Thanks, you are so helpful! I was looking for this kind of answers :)

  0

  

  Mebo David•130

  @meistensPosted over 2 years ago

  @Pawel-Gnat glad I could help

  0
• 

  Naif Sameer•90

  @naif-sameerPosted over 2 years ago

  Amazing Job 👍

  1