NFT preview component using BEM by Alexander MP

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  👾Hi Alex Martos P., congrats on completing this challenge!

  Here’s some tips to improve your component design:

  To improve your component overall responsiveness, something you can do its to create a media query to save space in the pricing section to make each information in a different row. Here’s the code for this media query.

  @media (max-width: 350px) {
  .card__meta {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-direction: column;
  }
  }
  

  ✌️ I hope this helps you and happy coding!

  0
• 

  Travolgi 🍕•31,400

  @denieldenPosted about 2 years ago

  Hi Alex, congratulations on completing the challenge, great job! 😁

  Some little tips for optimizing your code:

  • use main tag to wrap the all main content of page and improve the Accessibility, not as a container of card
  • you can use article or div tag instead of main tag to the container card for improve the Accessibility
  • add descriptive text in the alt attribute of the images
  • remove all margin from .card class because with flex they are superfluous
  • instead of using px use relative units of measurement like rem -> read here

  Hope this help! Happy coding 😉

  0