NFT preview card component using CSS

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-in and zoom-out in your card component )

body {
  box-sizing: border-box;
  background-color: var(--Very-dark-blue-main-BG);
  font-family: 'Big Shoulders Display', cursive;
  font-family: 'Outfit', sans-serif;
  display: grid; // add this 
  place-items: center; // add this 
  min-height: 100dvh; // add this 
}

.container {
  background-color: var(--Very-dark-blue-card-BG);
  height: 500px;
  width: 280px;
  margin: 100px auto; // remove this 
  border-radius: 15px;
  padding: 20px;
}