Responsive Layout using CSS Grid (And some flex box)

Community feedback

• 

  romila•3,570

  @romila2003Posted about 2 years ago

  Hi Em-ee24,

  Congratulations 🎉 for completing this challenge, your Time tracking dashboard component looks great, and it is great that you used CSS Grid to arrange the cards. I have some suggestions I want to address:

  1. Even though, it is great that you wrapped the main content within the main tag, you should also wrap the footer within the footer tag e.g. <footer class="attribution"></footer>
  2. Your images are missing the alt attribute which is essential for all images
  3. I noticed that all of your CSS and JavaScript is within your HTML file. I would recommend you using separate files as it will be easier for organisation.
  4. In desktop mode, you can use the flex property to center the card e.g.

  body {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    flex-direction: column;
  }
  

  Overall, great work and wish you the best for your future projects so keep coding 👍.

  Marked as helpful

  0

  ---

  

  MosElsh•200

  @mosElshPosted about 2 years ago

  @romila2003

  Hi romila,

  Thank you for your suggestions. I will update my solution if I have time. 👍

  1