First Submission - Results Summary Component - HTML and CSS only

Community feedback

• 

  Brandon Smith•80

  @brsmit1993

  Posted over 1 year ago

  If you're looking to organize your CSS better the two best pieces of advice I could give would be 1. Learn sass as soon as you can. Once you're comfortable with CSS learning how to use SASS will save you tons of headaches when it comes to organizing CSS the second thing would be to look into naming /organizing methods like BEM. BEM even if not followed perfectly just understanding the theory behind why / how people follow it will likely be a big help as well.

  https://www.toptal.com/css/introduction-to-bem-methodology

  00

  Marked as helpful
• 

  Bryan Li•3,530

  @Zy8712

  Posted over 1 year ago

  Your site looks pretty good. Main things I'd add/change:

  • center your component using flexbox instead of assigning margins to it. Right now you center you component using margin-top: 10vh. A better way of doing it would be to make the parent component center the box for you. In this case, the parent container is the body. So assigning something like this to your body should center it:

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

  • if you want to reduce the amount of lines in your css you should combine things like margin-top, margin-left, margin-right, and margin-bottom all under margin.
  • if you want to learn other ways of writing clean readable styling code, I suggest you to learn SASS/SCSS once you've mastered a bunch of the basics in css

  Hope you find this feedback useful 👍

  00

  Marked as helpful