NFT preview card component

Community feedback

• 

  Ahmed Bayoumi•6,740

  @Bayoumi-devPosted over 2 years ago

  Hey Ting-Huei Chen, It looks good!...

  My suggestions:

  • All page content should be contained by landmarks, Contain the attribution with <footer>.

  <footer>
     <div class="attribution">
        //...
     </div>
  </footer>
  

  • Center the component on the page with Flexbox, by giving the parent element <main> the following properties:

  main {
     display: flex;
     justify-content: center;
     align-items: center;
     min-height: 100vh;
  
     /* padding: .8rem;    <--- Remove */
     /* margin-top: 4rem;     <--- Remove */
   }  
  

  Some Resources

  • How to Center Anything with CSS - Align a Div, Text, and More
  • 11 Ways to Center Div or Text in Div in CSS

  Hope this is helpful to you... Keep coding👍

  0

  ---

  

  Ting-Huei Chen•160

  @hejkeikeiPosted over 2 years ago

  Hi @Bayoumi-dev Thank you so much! that was informative:) Flexbox does make center component vertically easier.

  0