Product Preview Card Component using CSS flex

Community feedback

• 

  gfunk77•1,200

  @gfunk77Posted about 1 year ago

  Nice work. So, to center the card you want to wrap everything inside a div. Right now all your elements are just floating there and are not inside of a container. Then, use flexbox on the body and make the height min-height: 100vh; Lastly, format your code so that it is easy to read. Highlight everything and then right click, you should see an option to 'format code'. Great start on this. I think you are going to make this look really beautiful! I hope this is helpful.

  body: {
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center
  }
  
  <div class="card">
  // all of your stuff here...
  </div>
  

  Marked as helpful

  1