Responsive NFT-Preview card

Community feedback

• 

  jimmy•200

  @jimmyhachemPosted over 2 years ago

  1. in the body : 'display:flex; justify-content: center; align-items: center; height: 100vh' , But you would have to correct the width and height of the 'wrapper'.

  2. Put everything in a div and add 'display:flex; justify-content: center; align-items: center; , width: 100%.

  3. in the wrapper : 'position: relative , left:50% , top:50% , transform: translate(-50% , -50%)'

  Hope this helps :)

  Marked as helpful

  0
• 

  Fatlind Shehu•2,230

  @fatlindshehuPosted over 2 years ago

  Hi @Feyisara2306,

  To my opinion the best method for centering a div/component is using flexbox:

  • display: flex to set the div/component as a flex container.
  • justify-content: center to center the div/component horizontally.
  • align-items: center to center the div/component vertically.
  • Make sure the div/component has a height.
  • If you’re unfamiliar with flexbox, I would suggest checking THIS
  • I would suggest measuring heights/widths & paddings/margins with more precision, using a tool like FIGMA or Adobe XD

  Keep up the good work!

  Marked as helpful

  0