HTML, CSS GRID, Display Flex, Media Queries

Community feedback

• 

  Vanza Setia•27,775

  @vanzasetiaPosted over 3 years ago

  👋Hi Marcio Lourenço!

  👍 Good job on finishing your first challenge!

  I have some feedback on this solution:

  • For decorative images, like in this case the illustration-hero and icon-music, you should leave the alt="" empty. That way the screen reader can ignore those images.
  • Typo:

  <span>Anuual Plan</span>
  

  • It seems like you wrap every element using a div. Why don't you just directly style the element? Like the h1?
  • Avoid using !important flag. In this case, it's not useful to increase the specificity.

  .itens-price span img {
      width: 74%!important;
  }
  

  • For the body, you shouldn't limit the height of it. I recommend to use min-height instead.
  • 👏 Good job on using rem and em unit, but you should use rem unit on max-width:420px; of your card too. Also, remove the width, it will prevent the card to get smaller on small screen size.

  That's it! Hopefully this is helpful!

  1

  ---

  

  Marcio Lourenço•40

  @marciolourensPosted over 3 years ago

  @vanzasetia Thank you very much! I really liked your tips. I will apply these changes to the project.

  0