NFT Card with CSS (flexbox)

Community feedback

• 

  Liam R•425

  @Cooly-o-CatsPosted almost 3 years ago

  This solution is great! Flexbox seems to be the right way to go in most of these situations for the design. The only thing I would change is giving the card a margin between the top and bottom of the screen!

  Marked as helpful

  1

  ---

  

  Adam Elitzur•110

  @AdamElitzurPosted almost 3 years ago

  @Cooly-o-Cats thanks! When you say margin between top and bottom, what do you mean? I still need it if I used flexbox? Also, when it says I need to have a mobile version, do I have to use media queries or is it fine how I did it where it auto resizes?

  0

  

  Liam R•425

  @Cooly-o-CatsPosted almost 3 years ago

  @AdamEli Sorry, I made it seem quite confusing the flexbox seems to be working fine now, but when the height of the screen is too small some of the card gets cut off. You can fix this by changing the body's height: 100vh; to min-height: 100vh. Hope this helps!

  Marked as helpful

  1

  

  Adam Elitzur•110

  @AdamElitzurPosted almost 3 years ago

  @Cooly-o-Cats Oh, I saw it doing that and wasn't sure why. But why min-height and not max-height? Also, what I said before, do you know if I need media queries? Thanks so much!

  0
• 

  Dev Rathore•2,600

  @GitHub-dev12345Posted almost 3 years ago

  used this CSS Property in your card to increase and decrease the size of card: 1.In Card design CSS Code Used this: transform : scale(0.9); large size for increase the number of scale & small size for decrease the number of scale

  1