Responsive NFT card (HTML, CSS)

Community feedback

• 

  Nwali Joseph•180

  @Source-WebPosted over 2 years ago

  To get the card to the center of the page, give it a specific width and set the margin to auto...

  What I did was get the card width and margin top and bottom then my code looked like this: .card { width: card width; margin: top-bottom auto; }

  Marked as helpful

  0
• 

  Macaulay Omoikhoje De-great•510

  @MacChristoPosted over 2 years ago

  if you are having issues with responsiveness, I think this might be able to help you.

  Marked as helpful

  0
• Account deleted

  Hey 👋,

  Great work on this challenge. Centering an element can be tricky but you have managed to do it in your solution. There are several ways to center an element. Using position: absolute; is one of them however it can be tricky to keep it consistent. I would recommend using flexbox. You can center an element by applying the following properties -

  .center{
      display: flex;
      align-items: center;
      justify-content: center;
  }
  

  Depending on the direction of your flex row | row-reverse | column | column-reverse the snippet above should help center the element both horizontally and vertically. You can read more about flexbox here

  Marked as helpful

  0