Stats preview card component

Community feedback

• 

  Michel Moreira•300

  @michel-moreiraPosted almost 2 years ago

  Hello mateus! I hope you are doing well!

  First of all congratulations to complete the challenge!

  I have some suggestions that might be useful!

  HTML

  • You should use the tag footer instead of div cause of semant HTML5 significance os tags, here:

  <div class="attribution">
        Challenge by
        <a href="https://www.frontendmentor.io?ref=challenge" target="_blank">Frontend Mentor</a>. Coded by
        <a href="https://www.frontendmentor.io/profile/mateuszk1os" target="_blank">
          mateuszk1os</a>.
      </div>
  

  • In the img tag, you must put an alternate text, the attribute "alt". The required alt attribute provides an alternate text for an image, if the user for some reason cannot view it (because of slow connection, an error in the src attribute, or if the user uses a screen reader). Source.

  CSS

  • You might consider break the code into chunks and create new stylesheets each responsible for one thing specifically, for exemple: That in reset.css

  *{
      margin: 0;
      padding: 0;
      box-sizing: border-box;
  }
  

  That in responsive.css

  @media (max-width : 500px) {...}
  
  

  And just the main style in style.css

  • No need to repeat reset code in @media queries, you can shorten few lines of code.

  FOLDERS

  • You can put in a folder that you should name "src" (source) others folders like 'image' and 'styles' to promote more organization in the project.

  I hope you find it useful! Above all, the solution you submitted is great!

  Happy coding!

  Marked as helpful

  1