Frontend Mentor | Results summary component

Community feedback

• 

  P

  Luis Vera•190

  @LuisVera1Posted 7 months ago

  @Hacklie

  Your solution looks great! However, here are some suggestions.

  --- Use the appropriate HTML element

  • Use the <main> to wrap all the content instead of a <div> element.
  • Your html has a lot of commented code, if this is not necessary, better delete it.

  --- Css

  • The names of the classes are very large, for example:

  results-summary__summary-div-category, you can use summary-category instead.

  And as for your error, it is caused by this line in your html

  `

  Marked as helpful

  1
• 

  Daniel 🛸•44,250

  @danielmrz-devPosted 7 months ago

  Hello, @Hacklie!

  Your project is looking fantastic!

  I'd like to suggest a way to make it even better:

  • Using margin isn't always the most effective method for centering an element.

  Here's a highly efficient approach to position an element at the center of the page both vertically and horizontally:

  📌 Apply this CSS to the body (avoid using position or margins in order to work correctly):

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

  I hope you find this helpful!

  Keep up the excellent work!

  Marked as helpful

  1
• 

  P

  Luis Vera•190

  @LuisVera1Posted 7 months ago

  Hi, something wrong with the last comment 🤭

  The error is in the line 14 in your html

  < script type= "module" src= "./data.json">< /script >
  

  You can also get the data with 'fetch', so it doesn't matter if the data is local or comes from an API, your project is ready!

  Good job!, greetings.

  0